CSS3是现今网页设计中最流行的样式语言之一,其外部样式能够使网页样式单独维护,方便快捷,同时也能够统一网站整体的视觉效果,提升用户体验。
/* 外部样式表.css代码 */ body { background-color: #F4F4F4; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; } h1 { color: #333; font-size: 36px; text-align: center; margin: 50px 0; } p { color: #666; font-size: 18px; line-height: 1.6; margin: 20px 0; } a { text-decoration: none; color: #0099FF; transition: color 0.2s ease-in-out; } a:hover { color: #49A1FF; }
以上是一个简单的外部样式表CSS代码,其中body标签设置了网页的背景颜色和字体样式,h1标签设置了网页标题的样式,p标签设置了段落的样式,a标签设置了超链接的样式,并添加了鼠标悬浮时颜色改变的效果。
在HTML中引用CSS文件,只需在头部添加一行代码即可:
<head> <link rel="stylesheet" type="text/css" href="外部样式表.css"> </head>
以上代码中,link标签引入外部样式表,并指定CSS文件路径。
使用外部样式表可以有效提高网页的可维护性和可读性,同时也能够增强网页的可重用性,使得网站整体风格更加协调一致。