文字属性

185 阅读2分钟
字体
font-family:name
font-family:"黑体"
大小
font-size:length(字号大小),win10系统浏览器默认字号大小为16px
    length:百分数|由浮点数字和单位标识符组成的长度值,不可为负值,其百分比取值是基于父对象中字体的尺寸;单位%、em(1em=100%)。工作中字号大小很少用百分比,基本用em
    p{font-size:12px}(绝对大小)
    p{font-size:20%}(相对大小)
文字粗细
    font-weight:normal|boid|bolder|lighter|number
        bold:粗体
颜色
    color:color
    #RRGGBB:三个两位十六进制正整数,取值为:00-ff
    rgb(R,G,B)表示红,绿,蓝的正整数或百分数数值;取值范围0~255
    rgba(红0~255,绿0~255,蓝0~255,不透明度0~10为完全不透明))
    color:颜色名称。不同的浏览器会有不同的预定义颜色名称
文字下划线、制定线、删除线:
    text-decoration:none|underline|blink|overline|line-through
    none:无装饰
    blink:闪烁(不兼容)
    underline:下划线
    line-though:删除线
    overline:上划线
float浮动对象
    取值为三个
    left:对象在左
    right:对象在右
    none:不浮动
实例:
    *{
        color:#333;(在网页中文字基本是深灰色而不是黑色)
    }
    section{
            width:800px;
            height:auto;
        }
    section>h2{
                font-size:20px;
                border-bottom:dashed 1px #333(给文字加下划线)
                padding-bottom:10px(控制下划线与文字之间的距离)
            }
    section>img{
                margin-right:10px;(设置图片位置)
                float:left;(让文字环绕图片)
            }
段落对齐方式:
    text-align:left|right|center|justify
        left:左对齐
        right:右对齐
        center:居中
        justify:两端对齐
    vertical-align:baseline|sub|super|top|text-top|middle|bottom|text-bottom|elngth(只适合于本身有valign属性的)
        top:支持valign特性的对象的内容与对象顶端对齐
        middle:支持valign特性的对象的内容与对象中部对齐
        bottom:支持valign的特性的对象的内容与对象底端对齐
设置行高和字母之间的间距
    ling-height:noemal|length
        normal:默认行高
        length:百分比数字,允许为负值百分比取值基于文字的高度尺寸
    letter-spacing:normai|length
        normal:默认间距
        length:由浮点数字和单位标识符组成的长度值,允许为负值
块级元素设置居中:height=ling-height文字垂直居中