码迷,mamicode.com
首页 > Web开发 > 详细

css属性

时间:2019-01-21 11:22:47      阅读:262      评论:0      收藏:0      [点我收藏+]

标签:水平对齐   红色   scroll   layout   ica   no-repeat   黄色   idt   ack   

属性和属性值
属性:属性是指定选择符所具有的属性,它是css的核心,css2共有150多个属性
属性值:属性值包括法定属性值及常见的数值加单位,如25px,或颜色值等。
 
文本属性
字体大小  
    font-size
    浏览器默认16px,视图默认12px
    pt:px=3:4
    1em=16px   0.75em=12px
    medium=16px/12pt/1em(常规大小)
    font-size:0(可以不带像素)
 
文本颜色
    color:rgb(0,0,0)或color:#
    rgba 全透明  a的取值范围(0-1)
    白色#fff  黑色#000 黄色#ff0  红色#f00
 
文本字体
    font-family
    1、常用微软雅黑
    2、改变浏览器默认字体
    3、多个字体时,首先显示字体1,不存在就显示字体2,以此类推
    4、中文字体或多个英文单词字体要用双引号括起来,单个英文单词字体不用
 
文字加粗
    font-weight
    bolder/bold/normal(常规)
    数字为100-900,没有单位,数字越大越粗
 
文字倾斜
    font-style
    italic 斜体字
    oblique  倾斜的文字
 
水平对齐
    text-align
    left/center/right
    justify两端对齐
    1、对横着的标签、纯数字和字母以及不换行的文字无效果
    2、对英文单词和行内元素以及行内块元素有效果
 
行高
    line-height
    1、line-height:20px(给像素):固定的行间距
    2、line-height:20(不带像素):字号大小的20倍
    3、line-height:500%(给百分号):行间距比当前字体高度大5倍
            字号大小+行距=行高(文字顶端到下一行文字顶端的距离)
    1)去掉文字默认的上下间距,行高=字号大小
    2)单行文本直接给了行高,数值包括文字默认上下间距,且居中
    3)有高有行高
        行高=高,文字垂直居中
        行高>高,文字靠下
        行高<高,文字靠上
 
文本修饰 
    text-decoration:none/underline/overline/line-through
    说明:
        none:没有修饰
        underline:添加下划线
        overline:添加上划线
        line-through:添加删除线
 
首行缩进
    text-indent:value
    说明:
        1、text-indent可以取负值;
        2、text-indent属性只对第一行起作用。
 
字间距
    letter-spacing:value
    控制英文字母或汉字的字距。
 
词间距
    word-spacing:value;
    控制英文单词词距。
 
文本流控制
    layout-flow:horizontal/vertical-ideographic;
    说明:
        1、horizontal:自左向右
        2、vertical-ideographic:自上而下
 
边框属性
边框宽度    border-width
边框颜色    border-color
边框样式    border-style:solid(实线) dashed(虚线) dotted(点划线) double(双线)
 
列表属性
列表样式            list-style-type:disc(实心圆) cirde(空心圆) square(实心方块)                list-style-type = list-stlye 去掉列表样式
用图作列表样式       list-style-image:url
定义列表符号位置     list-style-position:outside(外边) inside(里边)
 
背景图属性
背景颜色            background-color
背景图引入          background-image:url
背景图平铺          background-repeat:no-repeat(不平埔)repeat-x(横向)repeat-y(纵向)
背景图定位          background-position:left/center/right+数值(水平)
                                                                         bottom/center/top+数值(垂直)
滚动条              background-attachment:scroll(滚动) fixed(固定)
 
背景图显示范围:由元素的大小决定背景图显示多少
                           1、元素大小>背景图,默认下背景图在容器中平铺
                           2、元素大小<背景图,默认下,容器有多大,背景图就显示多少
                           3、元素大小=背景图 ,默认下背景图完全显示
                                同一个元素里,插入两个背景图,用(,)隔开

css属性

标签:水平对齐   红色   scroll   layout   ica   no-repeat   黄色   idt   ack   

原文地址:https://www.cnblogs.com/tis100204/p/10297141.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!