千家信息网

Css中表格和盒子模型怎么用

发表于:2024-12-03 作者:千家信息网编辑
千家信息网最后更新 2024年12月03日,这篇文章主要介绍Css中表格和盒子模型怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!表格border-collapse相邻单元格边框处理,合并表格=collapsebor
千家信息网最后更新 2024年12月03日Css中表格和盒子模型怎么用

这篇文章主要介绍Css中表格和盒子模型怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

表格

border-collapse相邻单元格边框处理,合并表格=collapse

border-spacing:相邻单元格间距

caption-side:标题位置

empty-cells:空单元格是否显示

列表

list-style-tyle:列表前边的标记样式 圆点,方点等等

list-style-image:列表图像标记

简写:list-style:none 取消列表的所有属性 一般用于导航

横向导航: li{display:inline}

透明度

opacity:设置透明度(0-1之间取值)

光标形状

cursor:设置光标形状,当光标放在某个div上边,设置等待状,手形状等等.

day03

盒子模型

盒子模型分为元素,内边距,边框,外边距,

1.设置一定尺寸的元素

1). width:设置元素宽度2). height:设置元素高度

2.设置内边距

padding-top/bottom/right/left

padding:简写形式

3.设置外边距(边框到浏览器边缘或者到下一个盒子的距离)

margin-top/bottom/left/right

margin:简写形式

4.设置最小和最大尺寸(宽度设置为百分比时,扩大或缩小浏览器或者换了大屏或小屏显示器之后,防止元素错位或溢出)

min-width:最小值为两div宽度相加值

max-width:最大值

5.处理元素内容溢出

overflow-x/y:xy轴溢出

overflow:简写形式: scroll设置滚动条(溢出处理方式)

6.改变元素类型

1).元素类型分为:

inline行内元素:在页面中不可设置宽高,也不会独占一行,b,span

inline-block行内块级元素:不能独占一行,但能设置宽高.img元素

block块级元素:独占一行,可以设置宽高,p,div元素

2).改变元素类型display:

元素类型可以相互转换,转化之后元素性质也随之改变

div一般不转化为行内元素,会丢掉,不能设置高

3).隐藏元素: display:none

7.浮动和阻止元素堆叠

浮动:float:left/right

消除元素堆叠在一起: clear:both(左右都消除)

以上是"Css中表格和盒子模型怎么用"这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注行业资讯频道!

0