<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS初始</title>
<!--
rel: relations 关联,指明关联的是stylesheet 样式表文档,表示link标签将会在html
文档初始化的时候被使用
type: css文本内容
href: css文件的地址; 本机地址: 要写相对路径; 网络地址: http(s)://. (//)
https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/static/css/index.chunk.css
-->
<link rel="stylesheet" type="text/css" href="">
<style>
span {
color: green;
font-size: 18px;
}
</style>
</head>
<body>
<!--
HTML: 超文本标记语言 HyperText Markup Language， 从语义化的角度描述页面
CSS: 层叠样式表 Cascading Style Sheets，从外观 审美的角度 改变页面的样式 外观
-1.行内样式
-2.外部引入/外联样式:
a.链接式： <link rel="stylesheet" href="">
b.导入式: @import, 写head标签的style标签内
<style>
@import "../style.css";
@import url(../style.css);
</style>
link和import的区别是什么?
- link 在html加载前就引用了
- import 在html加载后引用, 也就是先显示没有样式的页面,
然后再把样式加上，页面才正常显示
-3.内联样式:在head标签内直接使用 <style....</style>
优先级: 行内样式 > 内联样式 = 外联样式(谁后写，谁生效)
内外联: 都对span; 外: green, 内： red,
-->
<!-- 写在标签内的style叫 行内样式 -->
<span style="color: red">CSS 是层叠样式表</span>
<div></div>
<p></p>
<div>
<div>
<div>
<p></p>
</div>
</div>
</div>
</body>
</html>上述运行结果：
1397
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
