CSS样式基本知识

CSS样式可以写在那些地方呢?从CSS样式代码插入的形式来看可以分三种,内联式,嵌入式,外部式。


内联式:

css样式就是把css代码直接写在HTML标签中:

eg:

<p style="color:blue">我才开始学CSS。</p>
结果: 我才开始学CSS。

<p>我才开始学CSS。</p style="color:blue">/*错误*/
注意:

1.要写在元素开始的标签里。

2.css样式代码要写在style="  "的双引号中,如果有多条css样式设置,可以写在一起,中间用分号 ;  隔开。

<p style="color:aquamarine; font-size:12px">慕课网!</p>


嵌入式

嵌入式写在当前的文件中,嵌入式css样式必须写在<style></style>之间,并且一般情况下,嵌入式css样式写在<head> </head>之间,

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>嵌入式css样式</title>
<style type="text/css">
span{
   color:blue;
}
</style>
</head></span>
<body>
    <p>慕课网,<span>超酷的互联网</span>、IT技术免费学习平台,创新的网络一站式学习、实践体验;<span>服务及时贴心</span>,内容专业、<span>有趣易学</span>。专注服务互联网工程师快速成为技术高手!</p>
</body>
</html>
结果:

慕课网,超酷的互联网、IT技术免费学习平台,创新的网络一站式学习、实践体验;服务及时贴心,内容专业、有趣易学。专注服务互联网工程师快速成为技术高手!


外部式:

外部式css样式(也称为外联式),就是把css代码写到一个单独的外部文件中,这css样式文件以.css为扩展名,在<head>内,不是在<style>中,使用<link>标签将css样式文件链接到HTML文件中。

<link href = "base.css" rel = "stylesheet" type = "text/css"/>

讲解:

1.css样式文件名以有意义的英文字母命名,如 main.css

2. rel = "stylesheet" type = "text/css" 是固定的,不可以修改

3. <link> 标签一般写在<head>标签中

eg:




结果:

慕课网,超酷的互联网、IT技术免费学习平台,创新的网络一站式学习、实践体验;服务及时贴心,内容专业、有趣易学。专注服务互联网工程师快速成为技术高手!



三种方法的优先级: 就近原则:离被设置元素越近优先级越高,这是在三者权值相同的情况下,什么是权值,以后会讲解。




  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值