行内样式:
写在标签的 style 属性中(又称:内联样式)
语法:<h1 style="color:red;font-size:60px;">欢迎来学习前端</h1>
注:
1.style 属性的值不能随便写 要符合 CSS 的语法规范 是 (名:值)的形式
2.行内样式表 只能控制当前标签的额样式 对其他的标签无效
存在的问题:
书写繁琐 样式不能重复使用 并没有体现出:结构与样式分离 的思想 不推荐大量使用 只有对当前元素添加简单的样式时 才会偶尔使用
例:
成品图:
CSS内部样式:
写在 html 页面内部 将所有的 CSS 代码提取出来 单独放在 <style>标签中
语法:
例:
注:
1.<style>标签理论上可以放在 HTML 文档的任何地方 但一般都放在 <head>标签中
2.此种方法:样式可以复用 代码结构清晰
存在的问题:
1.并没有实现结构与杨时完全分离
2.多个 HTML 页面无法显示
外部样式:写在单独的 .css 文件中 随后在 HTML 文件中引入使用
语法:
1.新建一个扩展名为 .css 的样式文件 把所有 css 代码都放入到此文件中
2.在 HTML 文件中引入 .css 文件
<link rel="stylesheet" href="./xxx.css">
注:
示例图:
1.
2.