简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > 《CSS入门》内联式CSS和嵌入式CSS、外部CSS
Blogger Information
Blog 6
fans 0
comment 0
visits 4134
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
《CSS入门》内联式CSS和嵌入式CSS、外部CSS
若水的博客
Original
1265 people have browsed it

内联式CSS样式和嵌入式CSS样式、外部CSS样式

一、内联式CSS

css样式表就是把css代码直接写在现有的HTML标签中

<p style="color:red">这里文字是红色。</p>

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

二、嵌入式CSS样式

嵌入式css样式，就是可以把css样式代码写在<style type="text/css"></style>标签之间。主要用于单一网页页面

写在<head></head>之间

<style type="text/css">
span{
color:red;
}
</style>

三、外部CSS样式

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

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

注意：

1、css样式文件名称以有意义的英文字母命名，如 base.css。

2、rel="stylesheet" type="text/css" 是固定写法不可修改。

3、<link>标签位置一般写在<head>标签之内。


四、3种样式优先级

内联式 > 嵌入式 > 外部式

其实总结来说，就是--就近原则（离被设置元素越近优先级别越高）。




Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！