CSS_行内样式/内部样式和外部样式

行内样式:

写在标签的 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.

        

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值