<!DOCTYPE HTML><HTML lang="en"><head> <Meta charset="UTF-8"> <Title>CSS元素的显示模式</Title> <style> div{ background: red; wIDth: 200px; height: 200px; } span{ background: blue; wIDth: 200px; height: 200px; } img{ wIDth: 50px; height: 50px; } </style></head><body><!--在HTML中HTML将所有的标签分为两类,分别是容器级和文本级在CSS中CSS也将所有的标签分为两类,分别是块级元素和行内元素1.什么是块级元素,什么是行内元素?块级元素会独占一行行内元素不会独占一行容器级的标签div h ul ol dl li dt dd ...文本级的标签span p buis stong em ins del ...块级元素p div h ul ol dl li dt dd行内元素span buis strong em ins del2.块级元素和行内元素的区别?2.1块级元素独占一行如果没有设置宽度,那么默认和父元素一样宽如果设置了宽高,那么就按照设置的来显示2.2行内元素不会独占一行如果没有设置宽度,那么默认和内容一样宽行内元素是不可以设置宽度和高度的2.3行内块级元素为了能够让元素既能够不独占一行,又可以设置宽度和高度,那么就出现了行内块级元素--><div>我是div</div><p>我是段落</p><h1>我是标题</h1><hr><span>我是span</span><b>我是加粗</b><strong>我是强调</strong><hr><img src="images/picture.jpg" alt=""><img src="images/picture.jpg" alt=""></body></HTML> 总结 以上是内存溢出为你收集整理的Web全栈-CSS元素的显示模式全部内容，希望文章能够帮你解决Web全栈-CSS元素的显示模式所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）