-
菜单<li>浮动后,<li>脱离文档流,导致<ul>将失去高度和宽度;
如果需要对<ul>进行整体背景设置,首先要给<ul>定义宽、高。
查看全部 -
5-1伸缩菜单的制作查看全部
-
1.offsetWidth属性可以返回对象的padding+border+width属性值之和,style.width返回值就是定义的width属性值。 2.offsetWidth属性仅是可读属性,而style.width是可读写的。 3.offsetWidth属性返回值是整数,而style.width的返回值是字符串。 4.style.width仅能返回以style方式定义的内部样式表的width属性值。查看全部
-
1.如果要给水平菜单增加整体背景,需要对()进行哪些CSS设置?查看全部
-
jq部分: $(function(){ $("a").hover(function(){ $(this).stop().animate({"width":"160px"},200); },function(){ $(this).stop().animate({"width":"120px"},200); }) })查看全部
-
js实现简单动画查看全部
-
height与line-height设置成一样,文字就会垂直居中 鼠标经过时高度比其他菜单高的效果:margin-top:-10px;查看全部
-
backgroud-position中的像素值x y,其参照原点是标签的左上角,x为正值向原点右移相应像素单位,y为正值则向下移.查看全部
-
li { float:left } 增加可以纵向改为横向 ul { list-style:none; width:100px } 后面的width需要删除 缩进删除 text-align:center 文本对齐方式(居中)查看全部
-
基本的样式清除: *{margin:0;padding:0} 无序列表圆点去除: ul{list-style:none} 下划线去除: a{text-decoration:none} 文本缩进标签 text-indent 不会影响总体宽度(padding会) 需要将a标签设置为块元素,才能设高宽、hover效果 代码:a{display:block} hover格式 a:hover{}查看全部
-
水平导航需要设置float属性 基本清除样式:*{margin:0;padding:0;} 无序列表圆点清除:ul{list-style:none;} 文字下划线去除:a{text-decoration:none;} 文本缩进标签 text-indent 不会影响总体宽度(padding会) 需要将a标签设置为块元素,才能设高宽、hover效果 代码:a{display:block} hover格式 a:hover{}查看全部
-
1.有序列表 ol/li 有start属性, 最大序号为999 显示方式是列表前面有序号(序号形式由type属性值决定) 2.无序列表 ul/li 无start属性 显示方式是列表前面没序号,只有圆点(圆点样式由type属性值决定)查看全部
-
基本的样式清除:.body{margin:0;padding:0} 无序列表圆点去除: ul{list-style:none} 下划线去除: a{text-decoration:none} a标签是最内部的元素 变成块:dispay:block 对li的设置写入a中 对块元素进行设置hover a:hover{...}查看全部
-
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> *{margin: 0; padding:0;font-size: 14px} ul{list-style:none;width: 100px} a{text-decoration:none;display:block;height:30px;line-height:30px;background-color: grey;margin-bottom:1px;text-align:center; } a:hover{background:red;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>查看全部
-
圆角贴图水平菜单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>首页</title> <style> /*list style 表单样式 text-decoration 文本修饰 disply:block 使a标签成为块级元素 margin-bottom:设置 p 元素的下外边距 text-indent:文本缩进值*/ *{margin: 0;padding: 0;font-size: 14px;} ul{list-style: none;height: 50px;padding-left:30px;border-bottom: 5px solid #F60} li{float: left;margin-top: 20px} a{text-decoration: none;display: block;height: 30px;line-height: 30px;width: 120px;background-color: antiquewhite;margin-bottom: 1px;text-align: center; background: url("images/1.png")} .on,a:hover{color: azure;background-position: 0 -30px} </style> </head> <body> <ul> <li><a class="on" href="#">首页</a></li> <li><a href="#">新闻快讯</a></li> <li><a href="#">企业展示</a></li> <li><a href="#">联系我们</a></li> </ul> </body> </html>查看全部
举报
0/150
提交
取消