小技巧

Waiting_Police_code

于 2018-06-27 17:18:14 发布

阅读量141

点赞数

CC 4.0 BY-SA版权

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/Waiting_Police_code/article/details/79490377

前端专栏收录该内容

1 篇文章

订阅专栏

本文介绍了CSS中的实用技巧，包括如何仅设定元素宽度并让高度自适应内容、使用overflow属性控制溢出内容的显示方式、去除列表项符号、设置文本缩进及去除链接下划线等。还详细讲解了如何通过浮动和文本对齐实现垂直菜单到水平菜单的转换，以及背景图片的设置和定位。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

                    
                        
                    
                    CSS

只设定宽度，不设定高度。其高度会根据内容进行调整。
overflow:hidden超出宽高会被隐藏。
去掉小圆点list-style:none;
文本缩进text-indent:10px;
去下划线text-decoration:none;
垂直变水平菜单：li全部左浮动，文字居中显示。
添加图片background:url(../btnBg.png)，图片移位background-position:0 -30px;
菜单<li>浮动后，<li>脱离文档流，导致<ul>将失去高度和宽度；如果需要对<ul>进行整体背景设置，首先要给<ul>定义宽、高。

                