CSS（cascading style sheets）
1.语法
对象{
属性：属性值；
}
2.css的引入方式
2.1 行内样式（行间样式、内嵌样式、内联样式）
在标签中直接编写css样式，代码如下：
<div style="width: 200px;height: 200px;background:red;">
我是块元素
</div>
2.2 内部样式
在< head>< /head>中编写css样式，代码如下：
<head>
<style type="text/css">
/* style中type属性默认值为：text/css */
div{
width: 200px;
height: 200px;
background:red;
}
</style>
</head>
<body>
<div>
我是块元素
</div>
</body>
实现的效果如下图：
2.3 外部样式
外部样式有两种方式，一是使用link引入c，还有一种是通过import导入，代码如下：
/* 链接式 */
<link rel="stylesheet" href="../css/dome.css">
/* 导入式 */
<style>
@import url(../css/dome.css);
</style>
/* href与url中都是填写css文件的路径 */
链接式与导入式的区别：（拓展知识点）
当页面加载时，link引入的css会与页面同时加载，而import引用的css会等到页面全部被下载完再加载；
当js控制dom（document object model文档对象模型 ）去改变css样式时，只能使用link标签，不能使用import控制dom
| 方式 | 属于 | 兼容 | 加载情况 | 是否被js控制 |
|---|---|---|---|---|
| import | css | 有兼容问题 | 后加载 | 不能被js控制 |
| link | html | 没有兼容问题 | 同时加载 | 可以被js控制 |
扫一扫
654
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
