三、完整代码示例
代码示例
显示效果
一、标签显示模式示例
----
实现 横向导航栏 , 要求如下 :
每个导航按钮都有指定的宽高 ,
有默认背景 ,
鼠标移动上去背景和文字都会改变 ,
文字居中...宽高 就是其本身的宽高 , 为其设置宽高是无效的 ;
如果要为其设置宽高 , 必须将其设置为 行内块元素 , 使用
display: inline-block;
CSS 样式 , 可以将 行内元素 或...: 文字中间线 ;
基线 : 英文中部分字母的下边界 , 如 a , b , c , d 等到基线就结束了 , 一些长字幕 如 g , j 等需要延伸到 底线 ;
底线 : 文字下边界 ;
行高测量...与 盒子高度 关系 :
文本行高 = 盒子高度 : 文本垂直居中 ;
文本行高 > 盒子高度 : 文本偏下 ;
文本行高 < 盒子高度 : 文本偏上 ;
之前的 文本样式 :
文本偏上 , 说明...>
显示效果
默认状态 :
鼠标移动到链接上的样式 :
点击按钮 , 在新窗口中打开页面 :