语法格式
<标签名 属性1=“属性值1” 属性2....>内容</标签名>
注意
css文件可以复用，只要修改这个文件，链接这个文件的页面的样式也改变
新建页面先写开头
写的时候注意注释：ctrl+/ 添加注释的快捷键
子文件的命名：以sbu开头。
调用样式的三种方法:引入外部样式的方法、内部样式、行内样式
当样式设置发生冲突时，就近原则
权重大小：行内>内部>外部
(1)外部
<link rel="stylesheet" href="css/style01.css" />
设置页面颜色为红色(在css文：件里)
/*设置背景颜色为红色*/
body{
background-color: red;
}
链接外部文件的位置
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>标记的属性</title>
<link rel="stylesheet" href="css/1.css" />//这里
</head>
<body>
</body>
</html>
(2)内部
<style type="text/css">
</style>
(3)行内样式
<h1 style="color: green;">我是标题1</h1>
属性和样式的区别与联系
Tips:样式能实现的效果,属性不一定能实现;反过来,属性能实现的,样式一定能实现。
头部标记
1.标记的名称、单还是双标记
2.标记的功能
3.标记的使用方法和注意事项
-
titl
-
meta定义了编码格式；常用UTF-8和GB2312
UTF-8 和 GB2312 的区别（Web前端开发）
-
字符集范围（最核心区别）
- GB2312：简体中文专用，只包含汉字、字母、数字、常用符号，不支持繁体、生僻字、 emoji、外文。
- UTF-8：全球通用，包含所有语言文字 + emoji + 特殊符号，几乎无字符缺失问题。
-
编码长度（存储/传输）
- GB2312：英文/数字：1 字节；中文：2 字节
- UTF-8：英文/数字：1 字节；中文：3 字节；emoji/生僻字：4 字节
-
兼容性（Web 开发重点）
- GB2312：兼容性差，跨语言/跨平台易乱码，现代网站基本不用。
- UTF-8：全平台兼容，HTML、CSS、JS、数据库、浏览器默认都支持，是Web 标准编码。
-
前端使用建议
-
必须用 UTF-8，在 HTML 头部写：
<meta charset="UTF-8">
-
不要用 GB2312，否则：
-
生僻字、繁体、emoji 显示为方框/问号
-
多语言页面必乱码
-
1.意思：网页的元信息标签（给浏览器、搜索引擎看的，用户看不见）
2.作用：设置编码、描述、关键词、适配手机等
-
1.意思：网页描述
2.作用：写一段网页介绍，搜索引擎会显示在搜索结果下面
-
1.意思：设置编码为 GB2312（简体中文编码）
2.作用：让中文不乱码
-
1.意思：网页关键词
2.作用：给搜索引擎看，告诉它网页讲什么
-
1.意思：不缓存
2.作用：不让浏览器保存网页内容，每次都重新加载
-
1.意思：设置编码为 UTF-8
2.作用：全球通用编码，不乱码，现在网页必须用
-
1.意思：视口设置
2.作用：适配手机，让网页在手机上不乱、不缩放
网页Title规律总结（清晰好记）
-
格式规律：多数是「网站名 - 口号/功能」，少数直接写网站名
-
内容规律：都包含网站名，再加用途、口号、关键词
-
长度规律：一般10–30字，太长会被截断
-
作用规律：告诉用户这是什么网站，方便搜索和识别
-
通用规律：简洁、好懂、突出核心，不写无关内容
来源：https://www.cnblogs.com/qyfd7/p/19730533 |
發表於 2026-3-17 17:16:00