Css使用说明
Css使用说明
哎那个新来的 发表于8个月前
Css使用说明
  • 发表于 8个月前
  • 阅读 60
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

1.块级元素和行内元素的相互转换 【display:inline-block;vertical-align:top;】

2.对于元素 使用padding来填充,改变元素的大小 ,使用padding来填充大小,里面的文字自动会居中;对于行内元素使用inner-block修饰以后,使用width和height设置大小,文字不会居中,需要使用line-height和text-aligen来修饰居中

3.使用border-radius:6px 0 0 6px 来改变元素上下左右的圆角

4.层级结构的编写,

5.外层的宽度和高度不设置,让内部的元素来撑起

6.margin 来改位置

6.或者在div中对于他的子元素设置 position:relative 和left .top来实现位置

7. ul标签中也可以使用 text-align:center; 设置 子标签居中

8.字体改变颜色直接有color, 背景颜色 background

9.position:abosulute 使用时,它的父元素设置为position:relative,否则相对于body

10.display:inner-block 的注意:元素之间都 4px的间隔

11.position:relative相对于自己定位,移动以后,他原来的位置占有空间,如果标签宽和高变化,它原来的位置的宽和高也跟着变化。

12.块级元素和行内元素的区别:

每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级”元素(block-level);而span元素的默认display属性值为“inline”,称为“行内”元素。
div这样的块级元素,就会自动占据一定矩形空间,可以通过设置高度、宽度、内外边距等属性,来调整的这个矩形的样子;与之相反,像“span”“a”这样的行内元素,则没有自己的独立空间,它是依附于其他块级元素存在的,因此,对行内元素设置高度、宽度、内外边距等属性,都是无效的。【1.行内元素在同一水平线上排列,水平排列;块级元素单独占一行,下一个块级元素会从新的一行开始;2.块级元素可以包含块级元素和行内元素,行内元素不可以包含块级元素;3.行内元素设置宽和高无效,他根据包含的内容的大小决定自身的宽和高,同时可以设置padding来改变自身的大小】

当display:inner-block: 设置的元素既有行内元素的性质也有块级元素的性质

13:不用display:inline-block,可以使用line-height设置来实现一些功能,在一些行内元素中不设置border属性是没有的border的,设置了border以后,才可以设置border-width,但是input标签是默认具有input的。例如设置b标签的高度和input标签高度一致的时候,可以考虑到这些情况

14:设置float和absolute以后会破坏父元素的文档流结构,所以要对于float的要加清楚浮动,在有些地方需要给该元素的父元素加上清楚浮动

15.元素内容的垂直居中:该方法适用于单行文本(或图片)的垂直居中,我们需要做的仅仅是将line-height属性设置的大于font-size,且等于容器的高度。

标签: CSSViewer
共有 人打赏支持
粉丝 0
博文 84
码字总数 26529
×
哎那个新来的
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: