html+css制作一级水平导航菜单

 时间:2024-10-13 05:53:23

1、先来看一下我们要做一个什么样的一级导航菜单,这次以常见的位于中上部并居中的菜单为例,大家可以借鉴此方法,做出自己想做的以及导航菜单首先打开Hbuilder,创建html文件(点击图片放大看更佳哦)

html+css制作一级水平导航菜单html+css制作一级水平导航菜单

4、②在蟠校盯昂div中创建ul、li、a设置ul、li、a标签的样式,如图,部分属性带有注释在li中创建a标签是因为,在大多数情况下,我们每一个一级导航菜单都是带有链接的,在做这一步时养成这个习惯,将为我们减少许多不必要的麻烦

html+css制作一级水平导航菜单

5、运行查看ul和li需要注意的是,如果ul和a都用了margin-top,那么必须为其各自的父亲元素设置边框,因为margin只找其父元素的边框,否则将无法达到我们想要的效果我个人习惯设置咤胸剖玳像素为1px、颜色与父元素背景颜色相同的实线边框如li的样式中“ border:solid 1px #FFFFFF;”

html+css制作一级水平导航菜单

7、运行查看结果,发现了关键问题

html+css制作一级水平导航菜单html+css制作一级水平导航菜单
  • 如何在HTML中插入图片
  • html鼠标悬停变色
  • 在css中如何设置左浮动和右浮动?
  • HTML用代码制作虚线框方法
  • HTML怎么实现网页跳转
  • 热门搜索
    甘肃旅游线路 旅游招聘 天台旅游 澳门旅游学院 韩国个人旅游签证 象山旅游攻略 新疆旅游路线 横店旅游 下川岛旅游攻略 徐州旅游景点