行内块小案例 简单页面导航代码
行内块小案例 简单页面导航代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> a { /*模式转换行内块*/ display: inline-block; width: 100px; height: 30px; background-color: pink; /*文字水平居中*/ text-align: center; /*文字垂直居中*/ line-height: 30px; text-decoration: none; color: #fff; } /*鼠标经过*/ a:hover { background-color: #FFA500; color: yellow; } </style> </head> <body> <a href="">新闻</a> <a href="">汽车</a> <a href="">体育</a> <a href="">好用</a> </body> </html>