正文

01css的引入方式

heshun  2022-02-14  167

关键词：

引入CSS方式(重点掌握)

行内样式
内接样式
外接样式
1. 　链接式
2. 导入式

css介绍

现在的互联网前端分三层：

HTML：超文本标记语言。从语义的角度描述页面结构。
CSS：层叠样式表。从审美的角度负责页面样式。
JS：JavaScript 。从交互的角度描述页面行为

CSS：Cascading Style Sheet，层叠样式表。CSS的作用就是给HTML页面标签添加各种样式，定义网页的显示效果。简单一句话：CSS将网页内容和显示样式进行分离，提高了显示功能。

css的最新版本是css3，我们目前学习的是css2.1

接下来我们要讲一下为什么要使用CSS。

HTML的缺陷：

不能够适应多种设备
要求浏览器必须智能化足够庞大
数据和显示没有分开
功能不够强大

CSS 优点：

使数据和显示分开
降低网络流量
使整个网站视觉效果一致
使开发效率提高了（耦合性降低，一个人负责写html，一个人负责写css）

比如说，有一个样式需要在一百个页面上显示，如果是html来实现，那要写一百遍，现在有了css，只要写一遍。现在，html只提供数据和一些控件，完全交给css提供各种各样的样式。

行内样式

1 <div>
2 /*在行内改样式*/
3     <p style= "color: green">我是一个段落</p>  
4 </div>

View Code

内接样式

1 <style type="text/css">
2         /*写css代码更改样式*/
3         span{
4             color: blue;
5         }
6     </style>

View Code

外接样式-链接式

<link rel="stylesheet" href="./index.css">

View Code

外接样式-导入式

<style type="text/css">
        @import url(‘./index.css‘);
</style>

View Code

01-css的引入方式

在HTML中引入css方式总共有三种：行内样式内接样式外接样式　　　　　3.1链接式　　　　　3.1导入式 css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负... 查看详情

01-css的引入方式

在HTML中引入css方式总共有三种：行内样式内接样式外接样式　　　　　3.1链接式　　　　　3.1导入式css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负责页... 查看详情

01-css的引入方式

css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负责页面样式。JS：JavaScript。从交互的角度描述页面行为CSS：CascadingStyleSheet，层叠样式表。CSS的作用就是给H... 查看详情

01-css的引入方式

行内样式内接样式外接样式　　　　　3.1链接式　　　　　3.1导入式css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负责页面样式。JS：JavaScript。从交互的... 查看详情

01-css的引入方式和常用选择器

一、css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负责页面样式。JS：JavaScript。从交互的角度描述页面行为CSS：CascadingStyleSheet，层叠样式表。CSS的作用就... 查看详情

css层叠规则(即引入css的三种不同方式的优先级)

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"lang="en"> <head> <metahttp-equiv="Content-Type"conte 查看详情

css基础01-html页面嵌套使用css的三种方式(代码片段)

...什么程序？在HTML页面中嵌套使用CSS的三种方式HTML中引入CSS样式的第一种方式HTML中引入CSS样式的第二种方式HTML中引入CSS样式的第三种方式列表样式CSS样式的绝对定位什么是CSS，有什么作用？CSS(CascadingStyleSheet)：层... 查看详情

css引入方式

HTML中引入CSS的方式有4种方式可以在HTML中引入CSS。其中有2种方式是在HTML文件中直接添加CSS代码，另外两种是引入外部CSS文件。下面我们就来看看这些方式和它们的优缺点。内联方式内联方式指的是直接在HTML标签中的 style&nbs... 查看详情

css引入的方式

CSS引入的方式将CSS作用到HTML主要有四种方式，分别为HTML元素添加内联样式、<style>标签嵌入样式、<link>标签引入外部样式、@import导入外部样式。内联方式<divstyle="color:red"></div>特点不需要额外的HTTP请求... 查看详情

引入css的方式

---恢复内容开始---引入css的样式及link和@import的区别有3种引入方式1.内部样式(写在标签内)2.内联样式3.外部样式(link@import)区别:1.本质区别:link由HTML提供;@import由css提供,link可引用其他文件,@import只能引用css文件2.加载顺序的区别:lin... 查看详情

前端css的引入方式

！！！前端css的引入方式#1、css介绍#现在互联网分为三层：#html：超文本标记语言，从语义的角度描述页面结构。#CSS：层叠样式表，从审美的角度负责页面样式#JavaScript：从交互的角度描述页面行为##css：cascadingstylesheet，层叠样... 查看详情

css的引入方式和样式

CSS的引入方式和样式一.样式　　行内样式　　内接样式　　外接样式(1.链接式　　2.导入式)<div><pstyle="color:green">我是一个段落</p></div><styletype="text/css">span{color:yellow;}<... 查看详情

css的引入方式

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><styletype="text/css">span{color:yellow;}</style><linkrel="stylesheet"hre 查看详情

引入css的方式link和@import的区别

引入CSS的方式有四种：内联方式、嵌入方式、链接方式、导入方式。内联方式内联方式指的是直接在HTML标签中的 style 属性中添加CSS。<divstyle="background:red"></div>这通常是个很糟糕的书写方式，它只能改变当前标签... 查看详情

css的引入方式及选择器

CSS的引入方式第一种：在head中<style></style>嵌入式第二种：在head中<linkhref="index.css"rel="stylesheet">链接式（先加载css，再加载html）推荐第三种：在head中<style>@import"index.css";</style>>导入式（先加载html，再加载... 查看详情

css从入门到放弃系列：css的引入方式

css的四种引入方式内联方式(行间样式)<divstyle="width:100px;height:100px;background-color:red"></div>这通常是个很糟糕的书写方式，它只能改变当前标签的样式，如果想要多个<div>拥有相同的样式，你不得不重复地为每个<div>... 查看详情

前端css--引入方式和选择器

　引入css方式（重点掌握）行内样式内接样式外接样式　　　　　3.1链接式　　　　　3.1导入式css介绍现在的互联网前端分三层：HTML：超文本标记语言。从语义的角度描述页面结构。CSS：层叠样式表。从审美的角度负责页面样... 查看详情

css引入方式选择器

...据内容分离。步骤：　　A.找到标签B.操作标签一CSS四种引入方式1.行内式<pstyle="background-color:rebeccapurple">helloyuan</p>2.嵌入式<head><met 查看详情