hi,欢迎访问本站!
当前位置: 首页学习笔记正文

HTML ul-li横向排布

用户投稿 学习笔记 13阅读

HTML

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><link href="./style.css" rel="stylesheet" type="text/css"/></head><body><ul class="header"><li><a href="">1</a></li><li><a href="">1</a></li><li><a href="">1</a></li><li><a href="">1</a></li><li><a href="">1</a></li><li><a href="">1</a></li></ul></body></html>

CSS

.header{ list-style: none;//去除li前面的黑点 margin:0; padding:0; }.header li{ width: 50px; margin: 0 10px; float: left;//li横向排版}.header li a{ padding:0 20px; font-size: 20px; text-decoration: none;//去除a标签下划线 display: inline-block;https://blog.csdn.net/wwuuyun/article/details/114416521?spm=1001.2014.3001.5501 } }
标签:
声明:无特别说明,转载请标明本文来源!
发布评论
正文 取消