html引入css样式的简单介绍

在html中怎样使用css样式

在html网页中引入引入css主要有以下四种方式：

（1）行内式

p style=”color:red”网页中css的导入方式/p

（2）嵌入式

style type=”text/css”

P{ color:red }

/style

嵌入式一般写在head中，对于单个页面来说，这种方式很方便。

（3）导入式

!-- 导入外部样式：在内部样式表的style/style标记之间导入一个外部样式表，导入时用@import。 --

style type="text/css"

@import "jisuan.css";

/style

（4）链接式

link href="jisuan.css" rel=”stylesheet” type=”text/css” /

导入式和链接式差不多，都是从外部引入css文件。但是链接式对于客户端用户浏览网站时，效果会好些。

相关问答

Q1: HTML网页怎么使用CSS样式？

在制作一个网页的时候，Css样式的添加一共有四种方式，一起来看看这四种方式：

一、使用STYLE属性： 将STYLE属性直接加在个别的元件标签里。

元件(标签) STYLE="性质(属性)1: 设定值1; 性质(属性)2: 设定值2; ...}

例如：

TD STYLE="COLOR:BLUE; font-size:9pt; font-family:"标楷体"; line-height:150%

这种用法的优点 是可灵巧应用样式於各标签中，但是缺点则是没有整篇文件的『统一性』。

二、使用STYLE标签： 将样式规则写在STYLE.../STYLE标签之中。

通常是将整个的 STYLE.../STYLE结构写在网页的HEAD /HEAD部份之中。这种用法的优点就是在於整篇文件的统一性，只要是有声明的的元件即会套用该样式规则。缺点就是在个别元件的灵活度不足。

三、使用 LINK标签： 将样式规则写在.css的样式档案中，再以LINK标签引入。

假设我们把样式规则存成一个example.css的档案，我们只要在网页中加入

LINK REL=STYLESHEET TYPE="text/css" HREF="example.css"

即可套用该样式档案中所制定好的样式了。 通常是将LINK标签写在网页的head/head部份之中。这种用法的优点就是在於可以把要套用相同样式规则的数篇文件都指定到同一个样式档案即可。缺点也是在个别文件或元件的灵活度不足。

四、使用@import引入： 跟LINK用法很像，但必　放在STYLE.../STYLE 中。

要注意的是，行末的分号是绝对不可少的！这种方式也可以把

Q2: HTML中怎么导入css？

1

新建一个html文件，命名为test.html，用于讲解html中如何导入css。

请点击输入图片描述

2

在test.html文件内，使用div创建一个模块，下面将对该div进行css样式的定义。

请点击输入图片描述

3

在test.html文件内，设置div的class属性为mydiv，主要用于css文件对该类名进行样式定义。

请点击输入图片描述

4

新建一个css文件夹，在文件夹内创建一个css文件，命名为test.css，用于编写css样式。

请点击输入图片描述

5

在test.css文件内，使用div的类名进行样式定义，设置div的宽度、高度均为200px，背景颜色为黄色。

请点击输入图片描述

6

在test.html文件内，使用link标签导入test.css样式文件，href为css路径。

请点击输入图片描述

7

在浏览器打开test.html文件，查看实现的效果。

Q3: 在html中怎样使用css样式？

在html网页中引入引入css主要有以下四种方式：\x0d\x0a（1）行内式\x0d\x0a

网页中css的导入方式\x0d\x0a\x0d\x0a（2）嵌入式\x0d\x0a\x0d\x0a P{ color:red }\x0d\x0a\x0d\x0a 嵌入式一般写在head中，对于单个页面来说，这种方式很方便。\x0d\x0a\x0d\x0a（3）导入式\x0d\x0a \x0d\x0a \x0d\x0a @import "jisuan.css"; \x0d\x0a\x0d\x0a\x0d\x0a（4）链接式\x0d\x0a\x0d\x0a \x0d\x0a导入式和链接式差不多，都是从外部引入css文件。但是链接式对于客户端用户浏览网站时，效果会好些。

Q4: 在html下导入css

html引用css方法如下

1、直接在HTML标签中内嵌css样式

2、html中使用style自带式

3、使用@import引用外部CSS文件

4、使用link引用外部CSS文件 推荐此方法

方法说明：

1、直接在html标签元素内嵌入css样式

我是div css测试内容

效果如下图

1.jpg

2、在html头部head部分内style声明插入

代码如下：

!--

.ceshi {font-size:14px; color:#FF0000;}/*这里是设置CSS的样式内容*/

--

我是div css测试内容

效果同上。

3、使用@import引用外部CSS文件方法

HTML代码：

css引用方法实例

!--

@import url(wcss.css);/*这里是通过@import引用CSS的样式内容*/

--

我是div css测试内容

Wcss.css文件内代码.ceshi {font-size:14px; color:#FF0000;}

4、使用link来调用外部的css文件

在head放置

来调用外部的wcss.css文件来实现html引用css文件

此方法就不需要style标签，而是直接通过link一个样式来引用外部样式，一般推荐使用link来引用外部的css样式方法。

Q5: 在html文档中引用css有几种方式?分别是什么?

一般来说只有3种：

1.最常用的，引入样式表，在样式表中编写样式，引入方式如下：

link href="css/style.css" rel="stylesheet" type="text/css"

2.在Html头部用style/style包起来，在这里面编写样式：

style type="text/css"

*{

padding: 0;margin: 0

}

/style

3.在标签里面直接编写行内样式。

div style="color: #333"div

当然还有一种方式是用JS直接更改或者赋值给某个标签，但是其实是属于第三种的范围的