-
定义的关键是将 <a> 设置为块级元素,即:display:block ,不用对 li 标签进行设置查看全部
-
交互背景位置标签background-position: 0 -30px;查看全部
-
基本的样式清除: *{margin:0;padding:0} 无序列表圆点去除: ul{list-style:none} 下划线去除: a{text-decoration:none} 文本缩进标签 text-indent 不会影响总体宽度(padding会) 需要将a标签设置为块元素,才能设高宽、hover效果 代码:a{display:block} hover格式 a:hover{}查看全部
-
通过a:hover增加交互效果查看全部
-
文本居中标签text-align:center;查看全部
-
悬停效果选择器hover{}查看全部
-
变成块元素标签display:block;查看全部
-
文本缩进标签text-indent:10px;查看全部
-
去掉下划线标签text-decoration:none查看全部
-
line-height设置为和行高一样,可以实现垂直居中。center是水平居中查看全部
-
背景偏移定位方法: background-position:x y;查看全部
-
菜单<li>浮动后,<li>脱离文档流,导致<ul>将失去高度和宽度;如果需要对<ul>进行整体背景设置,首先要给<ul>定义宽、高。查看全部
-
1.如果要给水平菜单增加整体背景,需要对()进行哪些CSS设置? width and height查看全部
-
<style><br><br> *{margin:0;padding:0; font-size:14px;}<br><br> ul{list-style:none; height:50px;padding-left:30px;border-bottom:5px solid #F60;}<br><br> li{float:left; margin-top:20px;}<br><br> a{text-decoration:none;display:block;height:30px;line-height:30px;width:120px;background-color:#ccc;margin-bottom:1px;text-align:conter;background:url(images/btnBg,png)}<br><br> .on,a:hover{color:#fff; background-position:0 -30px;/*左右不动,向上移动背景图片*/}<br><br> </style><br><br> <br><br> <br><br> <br><br> <br><br> <body><br><br> <ul><br><br> <li><a class="on" href="#">首 页</a></li>/*默认选项*/<br><br> <li><a herf="#">新闻快讯</a></li><br><br> </ul><br><br> </body>查看全部
-
<style> *{margin:0;padding:0; font-size:14px;} ul{list-style:none;} li{float:left;} a{text-decoration:none: display:block;height:30px;line-height:30px;background-color:#ccc;margin-bottom:1px;text-align:center;} a:hover{background-color:#f60;color:#fff} </style> <body> <ul> <li><a herf="#">首 页</a></li> <li><a herf="#">新闻快讯</a></li> <li><a href="#">产品展示</a></li> <li><a herf="#">联系我们</a></li> </body>查看全部
举报
0/150
提交
取消