86_css笔记2_css的属性

一，文字属性

 <title>文字属性</title>
    <style>
        p{
            font-style: italic;
            font-weight: bold;
            font-size: 10px;
            font-family:"楷体";
        }
    </style>

• 字体样式：font-style

  • normal ： 正常的， 默认就是正常的
  • italic : 倾斜的

• 字体粗细：font-weight

  • 单词取值:bold 加粗；bolder 比加粗还要粗；lighter 细线， 默认就是细线
  • 数字取值：100-900之间整百的数字

• 文字大小：font-size

  • 单位：px（像素 pixel）， 通过font-size设置大小一定要带单位， 也就是一定要写px

• 字体属性：font-family

1. 如果取值是中文， 需要用双引号或者单引号括起来
2. 设置的字体必须是用户电脑里面已经安装的字体
3. 如果设置的字体不存在, 那么系统会使用默认的字体来显示
4. 字体的备选方案：格式:font-family:"字体1", "备选方案1", ...;
5. 同时设置英文字体和中文字体：font-family: Arial, "微软雅黑";
6. 因为英文字体不包括中文字体，但中文字体包括英文字体，所有顺序要英文在前
7. 常见的中文字体和英文字体
   1. 中文: 宋体/黑体/微软雅黑
   2. 英文: "Times New Roman"/Arial
8. 中文字体不一定名称是中文，英文字体不一定名称是英文
   1. 宋体 SimSun
   2. 黑体 SimHei
   3. 微软雅黑 Microsoft YaHei
9. size和family的位置是不能顺便乱放的
   size一定要写在family的前面, 而且size和family必须写在所有属性的最后
10. 字体的缩写
    1. sytle可以省略，weight可以省略；
    2. size不能省略，family不能省略

二，文本属性

 <style>
        p{
            text-decoration: none;
            text-align: left;
            text-indent: 2em;

        }
    </style>

• 1.文本装饰的属性：text-decoration

  • underline 下划线
  • line-through 删除线
  • overline 上划线
  • none 什么都没有, 最常见的用途就是用于去掉超链接的下划线

• 2.文本水平对齐的属性：text-align

  • left 左
  • right 右
  • center 中

• 3.文本缩进的属性 ：

  • 取值:其中em是单位, 一个em代表缩进一个文字的宽度

三，颜色属性

  <style>
        p{
            /*color: red;*/
            /*color: rgb(255,0,0);*/
            /*color: rgba(255,0,0,1);*/
            color: #FF0000;
            color: #F00;
            /*color: rgba(255,0,0,0.2);*/
            color: #ffee00;
            color: #fe0;
            color: #769abb;
        }
    </style>

• 1，颜色名称
  • color: red
• 2，rgb：
  • color: rgb(200,200,200)
• 3，rgba
  • color: rgba(255,0,0,1)
• 4，十六进制
  • color: #ffee00
• 5，十六进制缩写
  • 只要十六进制的颜色每两位的值都是一样的, 那么就可以简写为一位，#FFEE00 == #FE0
  • color: #fe0