CSS样式

最新推荐文章于 2023-08-05 00:00:00 发布

房东的喵

最新推荐文章于 2023-08-05 00:00:00 发布

阅读量123

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/luxunlx123/article/details/105844165

版权

前端专栏收录该内容

30 篇文章 0 订阅

订阅专栏

1. 内部样式表

语法：
<style type="text/clss">
/*cass语句*/
</style>
说明：
使用style标记创建样式时，最好将该标记写<head></head>之间

例：
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>内部样式</title>
        <style type="text/css">
        div {width: 100px; height: 100px ; background: #f00;}
        </style>
    </head>
    <body>
        <div>
        </div>
    </body>
</html>

2.内联样式
语法：
<标签 style="属性：属性值；属性：属性值；"></标签>

例：
 <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>内部样式</title>
    </head>
    <body>
        <div style="width: 100px; height: 100px; background: #0f0">
        </div>
    </body>
</html>

3.外部样式表

（1）外部样式表的创建
（2）外部样式表的导入
<link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称"/>

说明：
使用link元素导入外部样式表时，需将该元素写在文档头部，即<head></head>之间
rel：用于定义文档关联，表时关联样式表
type：定义文档类型

例：
（1）建立style文件夹建立style.css文件
div {width: 100px; height: 100px ; background: #0000ff;}
（2）建立css.html文件
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="style/style.css" />
    </head>
    <body>
        <div>
        </div>
    </body>
</html>


4.css样式表的优先级

内联样式表的优先级最高

内部样式表与外部样式表的优先级和书写顺序有关，后书写的优先级高。

房东的喵

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS样式

1. 内部样式表语法：<style type="text/clss">/*cass语句*/</style>说明：使用style标记创建样式时，最好将该标记写<head></head>之间例：<!DOCTYPE html><html> <head> <meta ch...
复制链接

扫一扫