美文网首页
CSS学习笔记(一)

CSS学习笔记(一)

作者: 行万_里路 | 来源:发表于2019-07-21 21:50 被阅读0次

    1.CSS样式规则

    格式:

    选择器{属性:值;属性:值;······;属性:值;}

    例子:


    h2 {

            font-size: 30px;

            font-family:"微软雅黑";

            font-weight:normal;

            font-style:normal;

            }


     2.CSS字体样式属性

    (1)字体大小:font-size

    字体单位属性值如图所示

    (2)字体:font-family

    字体属性值常常有宋体、微软雅黑、黑体等。

    (3)字体粗细:font-weight

    字体粗细的属性值有normal、bold、bolder、lighter、100-900(100的整数值);数值400等价于normal,数值700等价于bold。

    (4)字体风格:font-style

    属性值如下:

    normal:默认值,浏览器会显示标准的字体样式;

    italic:斜体字体样式;

    oblique:倾斜字体样式;

    (5)**综合设置字体风格**

    设置格式如下:

    选择器{font:font-style font-weight font-size font-family;}

    注:


    1. 按照格式书写,不能变换顺序,各属性以空格隔开。

    2. 无需设置的属性可省去(取默认值),必须保留font-size和font-family属性。


    3.CSS注释

    两种注释的使用规则:


    1. 注释格式:

    /* 需要注释的内容 */          “/*”为注释的开始,“*/”注释的结束。

    2. 注释格式:

    <!--需要注释的内容-->          “<!--”为注释的开始,“--> ”注释的结束。


    4.CSS三种不同的样式表

    1.行内式

    语法格式:

    <标签名 style=“属性:值;属性:值;······属性:值;”>内容</标签名>

    语法中style是标签的属性,HTML中标签都拥有style属性。

    2.内部样式表

    这种方式是将CSS代码集中书写在HTML中的head头部标签中。

    语法格式:


    <head>

    <style type="text/css">

    选择器{属性:值;属性:值;······属性:值;}

    </style>

    </head>


    3.外部样式表

    这种方式是将所有的样式放在一个或者多个以.css为扩展名的外部样式表文件,

    通过link标签链接到HTML文档中。

    语法格式:


    <head>

    <link href="css文件的路径" type=“text/css” rel="stylesheet"/>

    </head>


    注:


    1.link是单标签

    2.href表示链接文件的URL,可以是相对路径或者绝对路径。

    3.type的属性值表示链接的外部文件为CSS。

    4.rel的属性值表示被链接的文档是一个样式表文件。


    4.三种样式表的总结

    相关文章

      网友评论

          本文标题:CSS学习笔记(一)

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