首页 > 其他 > 详细

盒相关样式

时间:2018-04-30 20:58:06      阅读:167      评论:0      收藏:0      [点我收藏+]

盒的类型

一、盒的基本类型

在css中,使用display属性来定义盒的类型。总体来说,css中盒分为block类型与inline类型,例如div和p属于block类型,span和a属于inline类型。每一行只允许容纳一个block类型的元素,但是可以容纳多个inline类型的元素。

二、inline-block类型(inline-block类型盒加宽度时宽度会改变,inline类型盒加宽度盒不变)

Inline-block类型是在CSS2.1中追加的一个盒模型,目前为止,它受到了safari浏览器、Opera浏览器、Chrome浏览器、Firefox浏览器以及IE8以上版本浏览器的支持。inline-block类型盒属于block类型盒的一种,但是在显示时具有inline类型盒的特点。

默认情况下使用inline-block类型时并列显示的元素的垂直对齐方式时底部对齐,如果想改为顶部对齐,还需要在div元素的样式中加入vertical-align属性。去掉换行符加float。

三、inline-tablel类型

inline-tablel类型是css2中新增的盒类型,到目前为止,该类型受到了safari、opera、chrome、firefox以及IE8以上版本浏览器的支持。

四、list-item类型

如果元素的类型设置为list-item类型,可以将多个元素作为列表来显示,同时在元素的开头加上列表的标记(list-style-type)。

 

盒相关样式

原文:https://www.cnblogs.com/LLMjiayou7/p/8974554.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!