CSS定义的三种方式为( ).( ).( )

html-css018

CSS定义的三种方式为( ).( ).( ),第1张

有三种方法可以在站点网页上使用样式表:

1、外部样式:将网页链接到外部样式表。

2、内页样式:在网页上创建嵌入的样式表。

3、行内样式:应用内嵌样式到各个网页元素。

每一种方法均有其优缺点:

当要在站点上所有或部分网页上一致地应用相同样式时,可使用外部样式表。在一个或多个外部样式表中定义样式,并将它们链接到所有网页,便能确保所有网页外观的一致性。如果人们决定更改样式,只需在外部样式表中修改一次,而该更改会反映到所有与该样式表相链接的网页上。通常外部样式表以 .css 做为文件扩展名,例如 Mystyles.css。然后在需要此样式的页面中将其链接进来,如:

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

当人们只是要定义当前网页的样式,可使用嵌入的样式表。嵌入的样式表是一种级联样式表,“嵌”在网页的 <HEAD>标记符内。嵌入的样式表中的样式只能在同一网页上使用。 如:

<style type="text/css">

<!-- /* 把声明的样式包含在一个html注释中,这样可以解决较老的浏览器不识别style的问题 */

body {background:grey}

-->

</style>

使用内嵌样式以应用级联样式表属性到网页元素上。 如:

<pstyle="@import url('style3.css')">CSS document</p>

<!-- 不能在style属性中使用@import -->

如果网页链接到外部样式表,为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。

要在网页上使用外部样式表的样式,可将该网页链接到样式表,方法是使用位于 “格式” 菜单上的 “样式表连接” 命令。可以链接一个或数个样式表到网页视图模式下的当前网页,或到在文件夹列表中的所选网页,或到站点上的全部网页。

该“样式” 框列出标准 HTML 标记符,例如标题

1,还有嵌入的样式表或链接到网页的外部样式表中所含的类或 ID 选择器。要应用样式到网页元素,请选定该样式然后单击 “样式” 框中的样式或选择器。

在 Microsoft FrontPage 2000中,某些格式设置特性会作为内嵌样式自动应用。例如∶如果使用 “边框与阴影” 命令(在 “格式” 菜单上)在普通段落周围应用框,FrontPage 会写下格式设置信息,作为段落标记符的内嵌样式属性(例如∶ <p style="border-style: solid">)。然而某些属性的应用需要使用 CSS,其他则需要使用 HTML 。如果人们只想使用 CSS 应用内嵌样式,可使用 “样式” 按钮(位于网页元素的 “属性” 对话框里)应用类或 ID 选择器或嵌入式样式。

三中的使用方法的简单实例如下:

行内样式:

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css行内样式</title>

</head>

<body>

<div style="width:100pxheight:100pxbackground:red"></div>>

</body>

</html>

内嵌样式:

!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css内嵌样式</title>

</head>

<body>

<style type="text/css">

#div{width:100pxheight:100pxbackground:red}

</style>

<div id="div"></div>>

</body>

</html>

外部式:

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css内嵌样式</title>

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

</head>

<body>

<div id="div"></div>>

</body>

</html>

css文件

#div{width:100pxheight:100pxbackground:red}

拓展资料:

三中的使用方法的简单实例如下:

行内样式:

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css行内样式</title>

</head>

<body>

<div style="width:100pxheight:100pxbackground:red"></div>>

</body>

</html>

内嵌样式:

!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css内嵌样式</title>

</head>

<body>

<style type="text/css">

#div{width:100pxheight:100pxbackground:red}

</style>

<div id="div"></div>>

</body>

</html>

外部式:

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>css内嵌样式</title>

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

</head>

<body>

<div id="div"></div>>

</body>

</html>

css文件

#div{width:100pxheight:100pxbackground:red}

简言之:

行内样式:就是代码写在具体网页中的一个元素内;比如:<div style="color:#f00"></div>

内嵌式:就是在</head>前面写;比如:<style type="text/css">.div{color:#F00}</style>

外部式:就是引用外部css文件;比如:<link href="css.css" type="text/css" rel="stylesheet" />