asp.net

位置:IT落伍者 >> asp.net >> 浏览文章

ASP.NET入门教程 5.1.2 CSS 级联样式表[3]


发布日期:2020年07月12日
 
ASP.NET入门教程 5.1.2  CSS 级联样式表[3]

这些代码和前面示例中所使用的代码是一样的注意怎样使用<style>标记在页面的<head>区域内简便地嵌入样式信息在单个页面中使用这种技术是很好的实际上如果曾经将Word文档保存为HTML将看到这种技术用于定义文档的样式从而使得该文档呈现为HTML作者在Word 中将这个文件保存为Web Page(Filtered)这种方式产生的HTML代码比在Word中将这个文件保存为Web Page时自动产生的标准代码要整洁得多在保存该文件之后作者查看了产生的源代码并发现了如下所示的样式定义它们描述了在本章中使用的某些高亮区域是怎样定义的

pcode licode divcode

{margintop:cm;

marginright:cm;

marginbottom:cm;

marginleft:pt;

marginbottom:pt;

lineheight:%;

fontsize:pt;

fontfamily:Courler;}:

这种技术对于创建要在多个页面中使用样式信息的站点并不理想因为开发人员必须为站点内的每个页面单独地复制<styled>标记和样式定义对这种情况的解决方案是将样式定义移到一个单独的CSS文件中

将样式信息移动到单独的CSS文件中

这可能是最简单的一个步骤一旦将样式定义封装在<style>标记之内以后将这些信息提取到一个单独的样式表中实在是一件非常容易的事情开发人员需要进行的所有工作就是创建一个扩展名为CSS的文件将Web页面内的样式信息复制到该文件中并以如下方式添加该样式表的链接

<head runat=server>

<title>Styled Page </title>

<link href=StyleSheetcss rel=stylesheet type=text/css />

</head>

样式表文件中只包含样式信息因此可以说现在己拥有一个包含所有样式代码的样式表

HighlightedText

{

fontfamily: Trebuchet MS;

color: Navy;

}

a:link a:visited

{

color: #cc;

textdecoration: underline;

}

a:hover

{

textdecoration: none;

}

a:active

{

color: #ff;

textdecoration: underline;

}

[] [] [] [] []

               

上一篇:ASP.NET入门教程 5.1.2 CSS 级联样式表[1]

下一篇:ASP.NET入门教程 5.1.2 CSS 级联样式表[2]