CSS样式控制详解-优快云博客

本文链接：https://blog.youkuaiyun.com/benben574599386/article/details/100932069

定义：
层叠样式表或级联样式表，是一组格式设定规则，主要控制Web页面外观。
css引入方式：
1.行内书写-最简单的样式操作方法
基本语法:
<标签名 style=“具体样式属性：属性值”></标签名>
代码示例：

    <div style="border: 4px solid red;"></div>

 **代码解析：**

style是div的属性标签，表示的是样式；
style中的border是指边框的样式而“4px solid red”指的是4像素实线红色
2.内部书写-简化样式操作

       <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>我的HTML文件</title>
        <style>
            div{
                border:5px solid black
            }
        </style>
    </head>
    <body>
        <div>元素中的内容，该内容会显示在浏览器中</div>
        <div>
            <div>嵌套在父级div中的div元素1</div>
            <div>嵌套在父级div中的div元素2</div>
            <!-- <div style="border: 4px solid red;"></div> -->
        </div>
    </body>
</html>

“style” 中div 表示选择器；大括号｛｝包含具体的样式 “ border:5px solid black”表示的是具体样式的代码
3.外部引入-控制多页面样式
link标签：将外部样式表文件链接到html文档中
示例：
href：定义外部样式地址
type:定义文档类型 type="text/css"表示当前标签包含的样式是css
rel、rev:定义链接外部文件的关联类型 rel="stylesheet"表示浏览器在默认情况下会先执行样式表的文件类型
路径的特殊符号：
…/表示当前文件夹所在层级的上一级；
./ 表示当前文件所在的层级
/表示根目录

css简单介绍