CSS：display属性

最新推荐文章于 2022-12-27 11:04:33 发布

原创最新推荐文章于 2022-12-27 11:04:33 发布 · 414 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #display #none #inline #block

CSS页面布局及排版专栏收录该内容

4 篇文章

订阅专栏

本文介绍了CSS中的display属性，包括如何使用none、inline及block等值来控制元素的显示方式。通过示例展示了如何将元素设置为内联、隐藏或块级元素。

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

盒子的display属性

通过设置元素的display属性，可以改变某个元素本来的元素类型，或者把某个元素隐藏起来。这个属性在实际网页设计中用的非常频繁，而且发挥巨大作用。

常见的属性有①none:此元素不会被显示。

②inline:默认。此元素会被显示为内联元素，元素前后没有换行符。如div元素，p元素，ul元素

③block:此元素将显示为块级元素，此元素前后带有换行符。如span元素，a元素。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>display属性</title>
      <style>
      	p{display: inline;}
      	div{display: none;}
      	span{display: block;}
      </style>   	
	</head>
	<body>
		<p>此元素会被显示为内联元素，元素前后没有换行符。如div元素，p元素，ul元素</p>
	    <div>不会显示出来</div>
	    <span>此元素将显示为块级元素，此元素前后会带有换行符。</span>
        <span>不信你看</span>	
	</body>
</html>