css样式运用,CSS样式运用实验总结

css样式表怎么用啊

CSS的调用，按照CSS出现在页面的不同位置，可以分为3种方法：

元素中直接使用；

从页面头部调用；

采用链接的形式调用。

不同的调用方法有不同的写法和优先级。下面分别做一下介绍。

一、元素中直接使用

这种调用方式的写法如下：

元素名称 style="属性:属性值;"/元素名称

在样式中直接使用CSS，语法是使用style标签，在双引号中，样式的语法结构和独立样式表中完全相同。例如：

div style="width:240px;height:80px;background-color:#cccccc;text-align:center;font-size:14px"

示例：元素中直接调用。/div

该样式中定义了元素宽、高为360、80像素，背景色为灰色，字体大小为14像素。其应用到页面中的显示如图1。

二、从页面头部调用

从页面头部调用CSS是将CSS写在页面的head元素中，然后在页面中调用。其语法结构如下：

style

选择符{属性:属性值;}

/style

页面上的所有样式都可以写在style和/style中。使用这种方式调用CSS，在页面中必须有相应的调用代码。

其中，类选择符的调用代码如下：

元素名称 class="类选择符名称"/元素名称

ID选择符的调用代码如下：

元素名称 id="id 类选择符名称"/元素名称

下面我们来用一个示例演示一下。

head

titleCSS调用方法/title

style

.content{

background-color: #cccccc;

font-size: 14px;

width: 240px;

height: 80px;

color: Blue;

text-align: center;

}

/style

/head

body

div class="content"示例：从页面头部调用。/div

/body

该样式应用到页面的效果如图2所示。

三、采用链接的形式调用

采用链接的形式调用CSS通常有两种方法：

使用link元素

使用link元素调用CSS的语法如下：

link rel="stylesheet" href="css文件路径" type="text/css"/

其中rel="stylesheet"指这个link和其href之间的关联样式为样式表文件。type="text/css"指文件类型是样式表文本。

使用@import

使用@import调用和使用link元素调用的区别在于，使用@import的调用方法只能使用在样式文件中，即只能在调用的样式文件，或style元素中才能正常使用

相关问答

Q1: CSS样式表存在形式有哪些,应用的侧重点分别是什么？

一共有三种 形式存在

第一种为标签样式，taglib为标签名，后面{}里面加属性,这种样式对页面内所有的标签名为taglibname的标签起作用。

第二种为css类样式，需要在HTML开始标签 后缀 class="name"，name即类名，这类标签对HTML内所有后缀同样name的标签起作用 class="name" 可以设在多个开始标签后，表示这些标签具有同一类样式。

第三种为cssID样式，需要在HTML开始标签后缀 id="id",需要注意的是，ID样式的话，每一个name都是独立且不重复的，具有唯一性。

希望我的回答对你有帮助

Q2: css样式怎么调用

CSS是一门指定文档该如何呈现给用户的语言。

一、CSS帮助您将文档信息的内容和如何展现它的细节相分离

创建html文档

创建样式表

在与前面相同的目录中，新建另一个文本文件。该文件将成为您的样式表。请将它命名为：style1.css

在您的CSS文件中，复制、粘贴下面的行，并保存该文件:

二、连接您的文档和样式表

为将您的文档和样式表相连，请编辑您的HTML文件。并添加下面高亮的行：

保存该文件并刷新您的浏览器。该样式表将首字母显示为红色，如下所示：

三、rel=“stylesheet”是什么意思呢 

范例中呈现的是标准HTML link标签嵌入css档案的写法，其中「rel="stylesheet" type="text/css"」所代表的意思，就是告诉浏览器要导入一个在外部的css档案，透过href导入名为xxxx.css的样式档案。

Q3: css样式怎么引用的

CSS样式的引用方式有三种：

一、行间样式表

行间样式表是指将CSS样式编码写在HTML标签中，格式如下

h1 style="font-size:12px;color:#000FFF"

我的CSS样式。

/h1

行间样式表由HTML元素的HTML元素的style支持，只需将CSS代码用分号隔开写在style=""之中。这是最基本的形式，但是它没有实现表现与内容分离且不能灵活的控制多个页面所以我们只是在调试CSS代码的时候使用。

二、内部样式表

内部样式表与行间样式表相似都是把CSS代码写在HTML页面中，稍微不同的是前者可以将样式表放在一个固定的位置，格式如下

html

head

title内部样式表/title

style type="text/css"

h1{font-size:12px;

color:#000FFF

}

/style

/head

body

h1我的CSS样式。/h1

/body

/html

内部样式表编码是初级的应用形式，不能达到跨页面使用所以不适合使用。

三、外部样式表

外部样式表是CSS应用中最好的一种形式，它将CSS样式代码单独放在一个外部文件中，再由网页进行调用。多个网页可以调用一个样式文件表，这样能够实现代码的最大限度的重用及网站文件的最优化配置，格式如下

html

head

title外部样式表/title

link rel="stylesheet" rev="stylesheet" href="style.css"

/head

body

h1我的CSS样式。/h1

/body

/html

在style.css中的代码为

h1{font-size:12px;

color:#000FFF

}

我们在head中使用了link标签来调用外部样式表文件。将link指定为stylesheet方式，并使用了href="style.css"指明样式表文件的路径便可将该页面应用到在style.css中定义的样式。