CSS体验

作者: 幸运密码_xymm16888 | 来源:发表于2017-09-20 18:33 被阅读0次

    在企业开发中 修改样式都是交给 CSS 来做,设置样式 美化界面

    font标签:设置文本的 字体、大小、颜色

    font-weight: bold; /* 粗体 /
    font-family: "微软雅黑"; /
    字体设置 /
    font-size: 5; /
    字体大小 */

    CSS的格式:
    <style type="text/css"> 存储的是文本类型的css代码
    选择器 {
    属性名称:属性值 ;
    }
    </style>

    注意:
    ①style标签必须处于head标签内,和title标签同级
    ②设置样式时,必须按照固定格式 冒号和分号不能省略

    选择器 { 属性:值; 属性:值; }
    CSS中和文字相关的属性:

    -文字样式属性 p { font-style:normal; }
    normal 正常
    italic 倾斜
    快捷键 fsi+tab = font-style:italic;

    -文字粗细属性 p { font-weight:bold; }
    单词取值: bold加粗 bolder更粗 lighter细线(默认)
    数值取值:100-900之间
    快捷键 fwb+tab = font-weight:bold;

    -文字大小属性 p { font-size:10px; }
    取值单位为像素(pixel)
    通过font-size设置大小,一定要带单位px
    快捷键 fz30+tab = font-size:30px;

    -文字字体属性 p { font-family:微软雅黑; }
    默认是宋体,可修改为其它字体,如楷体
    如果取值为中文,需用 " " / ' ' 引起来
    设置的字体必须是用户电脑里面安装的字体
    如果设置字体不存在,系统会用默认字体(宋体)显示
    字体设置有备选方案:
    p { font-family:"我是不存在的字体","楷体" ; }
    浏览器会选择 楷体 显示。
    快捷键 ff+tab = font-family:

    一段文本中设置两种字体:
    但凡是中文字体,里面都包含了英文
    但凡是英文字体,里面都没有包含中文

    在企业开发中最常见的字体:
    中文 - 宋体、黑体、微软雅黑
    中文字体也有自己的英文名称,如 SimSun(宋体) SimHei(黑体)
    英文 - Times New Roman、Atrial

    文字属性的缩写:所有文字属性用一个写
    {font: italic bold 10px;} "楷体"; /* 一行写完所有的字体属性,位置不能乱调整,否则无效*/
    注意:
    可省略的 style / weight
    不可省略的 size / family
    位置不能乱调整

    文本属性:
    -文本装饰:下划线、删除线之类的
    text-decoration: underline; /* 装饰一条下划线 */
    取值:
    underline 下划线
    line-through 删除线
    overline 上划线
    none 什么都没有,可以去掉<a>标签超链接的下划线
    快捷键 tdu+tab = text-decoration: underline;

    -文本水平对齐
    text-align: center; /* 文本对齐属性 居中 */
    取值:
    left center right

    -文本缩进
    text-indent: 2em; /* 文本缩进2个字符 */
    取值:
    一个em代表一个文字有宽度

    CSS颜色属性:
    color: red;

    颜色属性的取值:红色
    coloe:rgb(255,0,0); 三原色(red / green / blue)
    红色:rgb(255,0,0)
    绿色:rgb(0,255,0)
    蓝色:rgb(0,0,255)
    黑色:rgb(0,0,0)
    白色:rgb(255,255,255)
    灰色:rgb三个的颜色一样,值小深灰,值大浅灰

    coloe:rgba(255,0,0); CSS3推出
    a:透明度 0-1,值越小越透明

    color:#FF0000; 十六进制
    每两个字母代表rgb中的一个数字

    color:#F00; 十六进制缩写
    在CSS中只要十六进制的每两个值都是一样的,就可以简写为一位。

    十进制:0-9,遇10进1 11
    十六进制:0-16,遇16进1
    1 2 3 4 5 6 7 8 9 a b c d e f

    十六进制 转换为 十进制
    十六进制第一位16 + 十六进制第二位 = 十进制
    15 == 1
    16 + 5 = 21
    00 == 016 + 0 = 0
    FF == 15
    16 + 15 = 255

    相关文章

      网友评论

          本文标题:CSS体验

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