CSS与DIV的一些基础知识(2)_html/css_WEB-ITnose
div,body
{
margin:0;
padding:0;
}
display:block;可将内联元素变成块元素 float:left;浮动,可将块元素排在一行 clear:both 清除浮动 html标签:有序列表 ul 里面的项是 li,ul和li都是块状元素,所以一个元素一行,要并行的话就浮动就可以了 float:left, 默认子项前存在圆点,可用list-style:none;去除(ul中)- MyHome
- 公司简介
- 公司业务
- 职业发展规划
- 我要应聘
- 在线问答
#nav ul li
{
float:left;
margin-right:1px;
height:35px;
line-height:35px;
text-align:center;
padding:0 10px;
}
网站中menu的话,按如上设计就可以了(基本结构)
text-decoration:none;表示文字正常样式 text-decoration:underline带下划线10. 标签:a:hover 是鼠标经过时
下面是经过这两次学习的一个小例子,一个导航条,首先是html方面的部分代码
MyHome a > li > 个人简介 a > li > 文档分类 a > li > 人生发展规划 a > li > 我要提问 a > li > 在线问答 a > li > ul > div >
之后是,应用到这个div的css代码
div,body,ul,li { margin : 0 ; padding : 0 ; } #nav { width : 960px ; height : 35px ; margin : 0 auto ; margin-top : 35px ; background-color : #CCC ; } #nav ul { width : 960px ; height : 35px ; list-style : none ; } #nav ul li { float : left ; margin-right : 1px ; height : 35px ; line-height : 35px ; text-align : center ; } #nav ul li a { font-size : 14px ; color : Black ; text-decoration : none ; padding : 0 10px ; height : 35px ; display : block ; float : left ; } #nav ul li a:hover { color : White ; background : #000 }
推荐阅读
-
div+CSS网页布局的意义与副作用原因小结第1/2页
-
div+CSS网页布局的意义与副作用原因小结第1/2页
-
div+CSS网页布局的意义与副作用原因小结第1/2页
-
Codeforces Round #156 (Div. 2)-A. Greg's Workout_html/css_WEB-ITnose
-
Codeforces Round #107 (Div. 2)-A. Soft Drinking_html/css_WEB-ITnose
-
Codeforces Round #191 (Div. 2)-A. Flipping Game_html/css_WEB-ITnose
-
DIV+CSS在不同浏览器中的表现_html/css_WEB-ITnose
-
Codeforces Round #279 (Div. 2)_html/css_WEB-ITnose
-
Codeforces Round #278 (Div. 2)B?? Candy Boxes_html/css_WEB-ITnose
-
Codeforces Round #277.5 (Div. 2) 解题报告_html/css_WEB-ITnose