-
background-position:0 -30px;查看全部
-
float:left;查看全部
-
display:block; text-indent:20px;查看全部
-
height与line-height设置成一样，文字就会垂直居中查看全部
-
菜单<li>浮动后，<li>脱离文档流，导致<ul>将失去高度和宽度；如果需要对<ul>进行整体背景设置，首先要给<ul>定义宽、高。查看全部
-
背景图片是 60px*120px；a标签只显示30px*120px，所以未选中的时候只显示上半部分（白色），选中之后设置 background-position：0 -30px，相当于显示的背景图片下移30px，于是能显示到橙色的。查看全部
-
float属性能将垂直菜单转变成水平菜单查看全部
-
基本的样式清除： *{margin:0;padding:0; font-size:14px } 无序列表圆点去除： ul{list-style:none} 下划线去除： a{text-decoration:none} 文本缩进标签 text-indent 不会影响总体宽度（padding会） 需要将a标签设置为块元素，才能设高宽、hover效果 代码：a{display:block} hover格式 a:hover{background-color:; color:}查看全部
-
基本的样式清除： *{margin:0;padding:0} 无序列表圆点去除： ul{list-style:none} 下划线去除： a{text-decoration:none} 文本缩进标签 text-indent 不会影响总体宽度（padding会） 需要将a标签设置为块元素，才能设高宽、hover效果 代码：a{display:block} hover格式 a:hover{}查看全部
-
菜单<li>浮动后，<li>脱离文档流，导致<ul>将失去高度和宽度；如果需要对<ul>进行整体背景设置，首先要给<ul>定义宽、高。查看全部
-
菜单<li>浮动后，<li>脱离文档流，导致<ul>将失去高度和宽度；如果需要对<ul>进行整体背景设置，首先要给<ul>定义宽、高。查看全部
-
文字缩进 20px text-indent:20px查看全部
-
水平和垂直菜单栏目的制作： 1.给li添加一个float:left； 2.把ul里面的width修改或者删除掉 3.再把text-indent修改一下或者换为:text-align:center; <html> <head> <meta http-equiv="content-type" content="text/css" charset="rgb2315" > <title>垂直菜单栏的制作过程</title> <style> *{ margin :0; padding :0; font-size :13px; } ul{ width :120px; list-style :none; padding :13px; } a { height: 30px; line-height: 30px; width: 100px; background-color: #ccc; margin-bottom :1px; text-decoration :none; text-indent :10px; display :block ; } a:hover{ background-color :#f60; color:#fff; } </style> </head> <body> <ul> <li><a href="#">首 页</a></li> <li><a href="#">你发个好</a></li> </ul> </body> </html>查看全部
-
垂直菜单栏目的制作： <html> <head> <meta http-equiv="content-type" content="text/css" charset="rgb2315" > <title>垂直菜单栏的制作过程</title> <style> *{ margin :0; padding :0; font-size :13px; } ul{ width :120px; list-style :none; padding :13px; } a { height: 30px; line-height: 30px; width: 100px; background-color: #ccc; margin-bottom :1px; text-decoration :none; text-indent :10px; display :block ; } a:hover{ background-color :#f60; color:#fff; } </style> </head> <body> <ul> <li><a href="#">首 页</a></li> <li><a href="#">打到卡里</a></li> <li><a href="#">的无法让</a></li> <li><a href="#">一天然后</a></li> <li><a href="#">你发个好</a></li> </ul> </body> </html>查看全部
-
需要多次学习查看全部
举报
0/150
提交
取消