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

css常见属性

时间:2018-02-01 00:10:46      阅读:234      评论:0      收藏:0      [点我收藏+]

标签:uppercase   4.4   groov   variant   从右到左   out   直接   样式   设置图   

css常见属性

1.颜色属性
    1.1 color属性定义文本的颜色
    1.2 color:green 
    1.3 color:#ff6600 可简写为#f60
    1.4 color:rgb(255,255,255)
    1.5 color:rgba(255,255,255,1) a表示alpha色彩空间的透明度取值0~1 1表示完全不透明
 
2.字体属性
    2.1 font-size 字体大小
        2.1.1 px:设置一个固定的值
        2.1.2 %:父元素的百分比
        2.1.3 smaller:比父元素更小
        2.1.4 larger:比父元素更大
        2.1.5 inherit:继承父元素
    2.2 font-family 定义字体
        font-family:"微软雅黑",serif;
        使用逗号隔开,以确保当字体不存在时,直接使用下一个
        
    2.3 font-weight 字体加粗
        normal,bold,bolder,lighter
        400=normal,700=bold
        范围:100-900
        
    2.4 font-style 字体样式
        normal, italic(斜体),oblique(倾斜),inherit
        
    2.5 font-variant小型大写字母显示文本
        normal,small-caps,inherit

3.背景属性
    3.1 背景颜色 background-color
    3.2 背景图片 background-image
        background-image:url(图片路径)
        background-image:none
    3.3 背景重复background-repeat
        repeat, repeat-x, repeat-y, no-repeat
        
    3.4 背景位置background-position
        纵向:top center bottom
        横向:left, center, right
    
    3.5 简写方式
        background:背景颜色,url(图像),重复,位置
        background:#f60 url(images/bg.jpg) no-repeat eop center
        
4.文本属性

    4.1 text-align 横向排列
        left center right
    
    4.2 line-height 文本行高
        %基于字体大小的百分比行高
        数值来设置固定值
    
    4.3 text-indent首行缩进
        %父元素的百分比
        px固定值默认是0
        inherit继承
        
    4.4 letter-spacing字符间距
        normal 默认
        length设置具体的数值
        inherit继承
        
    4.5 word-spacing单词间距
        normal标准间距
        px固定值
        inherit继承
        
    4.6 direction文本方向
        ltr从左到右,默认值
        rtl从右到左
        inherit继承
        
    4.7 text-transform 文本大小写
        capitalize 单词首字母大写
        uppercase 全部大写
        lowercase 全部小写
        inherit 规定从父元素继承text-transform 属性的值
        

5、边框属性

    5.1 边框风格border-style
        border-style 统一风格
        单独定义某一方向的边框样式
            border-bottom-style
            border-top-style
            border-left-style
            border-right-style
        边框风格样式的属性值
            none无边框
            solid直线边框
            dashed虚线边框
            dotted点状边框
            double双线边框
            groove凸槽边框
            ridge垄状边框
            inset inset边框
            outset outset边框
            inherit继承
    5.2 边框宽度
    
    5.3 边框颜色
    
6、列表属性

    6.1 标记的类型 list-style-type如空心圆、实心方块等
    6.2 标记的位置 list-style-position 文本以内或者文本以外
    6.3 设置图像列表标记 list-style-image 
    6.4 简写方式 list-style
            list-style:square url(‘/i/arrow.jpg‘)

 

css常见属性

标签:uppercase   4.4   groov   variant   从右到左   out   直接   样式   设置图   

原文地址:https://www.cnblogs.com/themost/p/8395051.html

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