代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> a { display: inline-block; width: 100px; height: 50px; background-color: red; text-align: center; line-height: 50px; text-decoration: none; color: white; } a:hover { background-color: skyblue; } </style> <body> <a href="#">导航1</a> <a href="#">导航1</a> <a href="#">导航1</a> <a href="#">导航1</a> <a href="#">导航1</a> </body> </html>
刚开始使用的是浮动元素，其实是可以使用转换为行内块元素就可以的，效果一样。
