css样式学习

作者: hey_沙子 | 来源:发表于2019-07-16 17:48 被阅读0次
    1、overflow 属性规定当内容溢出元素框时发生的事情

    这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。


    属性值.png
    属性值:scroll
    2、white-space 规定段落中的文本不进行换行

    white-space 属性设置如何处理元素内的空白。

    这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。


    属性值.png
    3、text-overflow属性规定当文本溢出包含元素时发生的事情。
    属性值.png
    属性值:ellipsis
    4、letter-spacing属性增加或减少字符间的空白(字符间距)

    该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。因此,normal 就相当于值为 0。


    属性值.png
    属性值eg.png
    5、flex让所有弹性盒模型对象的子元素都有相同的长度,且忽略它们内部的内容

    flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。
    flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写属性。
    注意:如果元素不是弹性盒模型对象的子元素,则 flex 属性不起作用


    flex:1
    6、flex-wrap 属性规定flex容器是单行或者多行,同时横轴的方向决定了新行堆叠的方向。。

    注意:如果元素不是弹性盒对象的元素,则 flex-wrap 属性不起作用。


    属性值.png
    属性值:wrap 属性值:nowrap
    7、flex-direction 属性规定灵活项目的方向。

    注意:如果元素不是弹性盒对象的元素,则 flex-direction 属性不起作用。

    属性值.png
    8、flex-flow 属性是 flex-direction 和 flex-wrap 属性的复合属性。

    flex-flow 属性用于设置或检索弹性盒模型对象的子元素排列方式。
    flex-direction 属性规定灵活项目的方向。
    flex-wrap 属性规定灵活项目是否拆行或拆列。
    注意:如果元素不是弹性盒对象的元素,则 flex-flow 属性不起作用。

    9、background-Origin属性指定了背景图像的位置区域。
    属性值.png

    相关文章

      网友评论

        本文标题:css样式学习

        本文链接:https://www.haomeiwen.com/subject/taekqctx.html