CSS属性

最新推荐文章于 2024-09-04 20:29:03 发布

sundaxiao

最新推荐文章于 2024-09-04 20:29:03 发布

阅读量271

点赞数

CC 4.0 BY-SA版权

分类专栏： CSS 文章标签： css

本文链接：https://blog.youkuaiyun.com/sunxiaofre/article/details/56028982

CSS 专栏收录该内容

10 篇文章

订阅专栏

CSS属性

规定文字样式的属性

格式：font-style: normal（正常，默认），italic（倾斜）;

规定文字粗细的属性

文字取值：font-weight:lighter（细线，默认），bold（粗体），bolder（更粗）;
数字取值：100-900之间整百的数字来规定粗细；

规定文字大小的属性

格式：font-size: 30px;
单位：px（像素 pixel）;
注意：通过font-size设置大小一定要带单位px;

规定文字字体的属性

font-family:"楷体";
注意：若取值是中文，需要用双引号或单引号引起；
注意：设置的字体必须是用户电脑中已有的字体；
注意：若设置的字体不存在又不想用系统默认字体，可以给字体设置备选方案
    格式：font-family:"字体1","备选字体2",···
注意：凡是中文字体，里面都包含了英文；凡是英文字体，里面都不包含中文；
    若想给页面中的英文单独设置字体，一定要把英文的字体写在前面，中文字体写在后面作为备选字体；
常见字体：
    中文：宋体、黑体、微软雅黑；
    英文：Times New Roman、Arial
    并不是名称是英文就一定是英文字体，看是不是英文字体在于看能不能处理中文，英文字体不能处理中文；

文字属性的缩写

格式：font: style（可省略） weight（可省略） size family;
注意：style可省略，weight可省略，且style和weight位置可以交换；
注意：size不能省略，family不能省略，
     且size和family的位置不可交换，
     且size和family必须写在所有属性之后；
示例：font: italic bold 10px "楷体";

文本装饰的属性

格式：text-decoration: underline;
取值：underline（下划线），line-through（删除线），overline（上画线），none（重要！去掉以上线，如去掉超链接的下划线）；

文本对齐的属性

格式：text-align: center;
取值：left，right，center;

文本缩进的属性

格式：text-indent: 2em;
取值：em（1em：1个文字的宽度；2em：2个文字的宽度）;

代码汇总：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css</title>
    <style type="text/css">
        h1{
            font-style:normal;
            font-weight:bold;
            font-size: 30px;
            font-family:"楷体";
            text-decoration: underline;
            text-align: center;
            text-indent: 2em;
        }

        h2{
            font-weight:lighter;
        }

        p{
            font-style:italic;
            font-weight:bolder;
        }
        div{
            font: italic bold 10px "楷体";
        }

    </style>
</head>
<body>
<h1>CSS基本属性123讲</h1>
<p>CSS基本属性123讲</p>
1，规定文字样式的属性
    格式：font-style: normal（正常，默认），italic（倾斜）;
2，规定文字粗细的属性
    文字取值：font-weight:lighter（细线，默认），bold（粗体），bolder（更粗）;
    数字取值：100-900之间整百的数字来规定粗细；
3，规定文字大小的属性
    格式：font-size: 30px;
    单位：px（像素 pixel）;
    注意：通过font-size设置大小一定要带单位px;
4，规定文字字体的属性
    font-family:"楷体";
    注意：若取值是中文，需要用双引号或单引号引起；
    注意：设置的字体必须是用户电脑中已有的字体；
    注意：若设置的字体不存在又不想用系统默认字体，可以给字体设置备选方案
        格式：font-family:"字体1","备选字体2",···
    注意：凡是中文字体，里面都包含了英文；凡是英文字体，里面都不包含中文；
        若想给页面中的英文单独设置字体，一定要把英文的字体写在前面，中文字体写在后面作为备选字体；
    常见字体：
        中文：宋体、黑体、微软雅黑；
        英文：Times New Roman、Arial
        并不是名称是英文就一定是英文字体，看是不是英文字体在于看能不能处理中文，英文字体不能处理中文；
5，文字属性的缩写
    格式：font: style（可省略） weight（可省略） size family;
    注意：style可省略，weight可省略，且style和weight位置可以交换；
    注意：size不能省略，family不能省略，
         且size和family的位置不可交换，
         且size和family必须写在所有属性之后；
    示例：font: italic bold 10px "楷体";
6，文本装饰的属性
    格式：text-decoration: underline;
    取值：underline（下划线），line-through（删除线），overline（上画线），none（重要！去掉以上线，如去掉超链接的下划线）；
7，文本对齐的属性
    格式：text-align: center;
    取值：left，right，center;
8，文本缩进的属性
    格式：text-indent: 2em;
    取值：em（1em：1个文字的宽度；2em：2个文字的宽度）;

</body>
</html>