zoukankan      html  css  js  c++  java
  • CSS3选择器、背景、边框、文本

    选择器:

    [attribute^=value] 属性值以value开头的元素

    [attribute&=value] 属性值以value结束的元素

    [attribute*=value] 属性值包含value的元素

    :first-of-type 父元素第一个兄弟元素

    :last-of-type 父元素最后一个兄弟元素

    :only-child 父元素只有唯一一个子元素

    :only-of-type 父元素只有唯一一个兄弟元素

    :nth-child(n) 父元素第n个子元素

    :nth-last-child(n) 父元素倒数第n个子元素

    :nth-of-type(n) 父元素第n个兄弟元素

    :empty 没有子元素的元素

    :checked 被选中的元素

    边框:

    border-radius:圆角边框

    border-radius:length;

    /*以length为半径的圆角*/

    box-shadow:边框阴影

    box-shadow:h-shadow v-shadow blur spread color inser/outset;

    /*h-shadow:水平位置,v-shadow:垂直位置,blur:模糊距离,spread:阴影尺寸,color:阴影颜色,inser:内部阴影/outset:外边阴影*/

    border-image:边框图片

    border-image-source:图片路径

    border-image-slice:边框向内偏移

    border-image-图片边框宽度

    border-image-outset:边框图像超出边框的量

    border-image-repeat:边框是否平铺(repeated)、铺满(rounded)、拉伸(stretched)

    背景:

    background-clip:背景绘制区域 border-box、padding-box、content-box

    backdround-origin:背景定位 border-box、padding-box、content-box

    background-size:length | percentage | cover | contain

    /*length:图片宽高:第一个值宽度,第二个值高度*/

    /*percentage:以父元素百分比宽高:一宽,二高*/

    /* cover:完全覆盖背景区域*/

    /*contain:完全覆盖内容区域*/

    文本:

    text-shadow:文本阴影

    text-shadow:h-shadow v-shadow blur color

    /*h-shadow:水平位置,v-shadow:垂直位置,blur:模糊距离,color:阴影颜色*/

    word-wrap:换行

    word-warp:normal(断字点换行)|break-wrap(长单词或URL换行)

  • 相关阅读:
    python3获取文件夹大小
    git master分支被污染,dev是最新稳定的
    优化经验杂记
    kong
    prometheus
    C# 线程执行带参方法的几种写法(ThreadStart,delegate (),()=>)
    MySql字符集utf8mb4和utf8区别
    程序员必备的一些数学基础知识
    hbase统计表的行数的三种方法
    Flink实时计算pv、uv的几种方法
  • 原文地址:https://www.cnblogs.com/qyhyq/p/4638161.html
Copyright © 2011-2022 走看看