css——导航栏

导航栏一般用无序列表制作

但出来的导航栏有黑点,还有一些边距

去除黑点我们可以用:list-style-type: none;/*去掉ul前面的点*/

因为有些标签之间会有默认的边距,所以可以先将边踞清零,“*”代表所有标签

*{

margin: 0px;/*边距全为0*/

padding: 0px;/*填充全为0*/

}

如果导航栏有宽度,将导航栏左右居中,可以用margin.

方法1)margin-left: auto;margin-left: auto; 2)margin:auto;

margin扩展:margin是边界,一个盒子有4个边界

margin:10px;上,下,左,右都是10px

margin:10px 50px;第一个参数是上下,第二个参数是左右

margin:10px auto 50px;第一个是上,第二个是左右,第三个是下

margin:10px 20px 30px 40px;顺序:上,右,下,左

同理,padding是一样的

居中之后我们要让导航栏从左至右排列,让每个li块左浮动,并且要让ul块自动撑开,所以在#daohang{}中加overflow: hidden;   在#daohang li {}中加float: left;在导航栏中还要加背景色,改变字体颜色,去除链接下划线,设定鼠标移上去的颜色

posted @ 2019-05-27 20:58  ellenxx  阅读(244)  评论(0编辑  收藏  举报