CSS经验分享:书写高效CSS注意的七个方面
作者:admin
来源:未知
日期:2011-10-27
点击:0
一、使用外联样式替代行间样式或者内嵌样式
不推荐使用行间样式
Example Source Code []<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page title - </title>
</head>
<body>
<p style="color: red"> ... </p>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page title - </title>
</head>
<body>
<p style="color: red"> ... </p>
</body>
</html>
不推荐使用内嵌样式
Example Source Code []<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page title - </title>
<style type="text/css" media="screen">
p { color: red; }
</style>
</head>
<body>... </body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page title - </title>
<style type="text/css" media="screen">
p { color: red; }
</style>
</head>
<body>... </body>
</html>
推荐使用外联样式
Example Source Code []<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text
<title>Page title - </title>
<link rel="stylesheet" href="name.css" type="text/css" media="screen" />
< /head>
<body> ... </body>
</html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text
<title>Page title - </title>
<link rel="stylesheet" href="name.css" type="text/css" media="screen" />
< /head>
<body> ... </body>
</html>
二、建议使用 link 引入外部样式表
为了兼容老版本的浏览器,建议使用 link 引入外部样式表的方来代替 @import导入样式的方式.
译者注: @import是CSS2.1提出的所以老的浏览器不支持,点击查看 @import的兼容性。