新浪导航栏(CSS)
生活随笔
收集整理的這篇文章主要介紹了
新浪导航栏(CSS)
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
效果:
代碼:
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.nav{height: 41px;border-top: 3px solid chocolate;border-bottom: black 1px solid;}.nav a {/* a是行內(nèi)元素沒(méi)有大小需要轉(zhuǎn)換 */display: inline-block;height: 41px;/* 行高等于高,使文字垂直居中 */line-height: 41px;text-decoration: none;padding: 0px 20px;color: black;font-size: 12px;}.nav a:hover{background-color: ghostwhite;color: goldenrod;}</style> </head> <body><div class="nav"><a href="#">設(shè)為首頁(yè)</a><a href="#">手機(jī)新浪網(wǎng)</a><a href="#">移動(dòng)客戶端</a><a href="#">博客</a><a href="#">微博</a><a href="#">關(guān)注我</a></div></body> </html>復(fù)習(xí)盒子模型
總結(jié)
以上是生活随笔為你收集整理的新浪导航栏(CSS)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 飞凌嵌入式全志A40i开发板试用体验之
- 下一篇: 使用 CSS 构建自定义粘性导航栏