css样式覆盖原则 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
.test{
/*     font-size: 20px; */
/*     font:300 12px/24px "宋体",arial,serif; */
        font-size: 20px;
}

</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<style>
body{font:300 12px/24px "楷体",arial,serif;}
</style>
<div class="test">途牛旅游网</div>
</body>
</html>

test里面的字体样式只是把body里面的字体样式中的字体大小12px覆盖掉，body里面的字体除了大小其他样式可以生效且合并。如果都是同样的样式则test样式覆盖body里面的样式，比如

test样式中的font-size:20px;会把body里面的字体样式font-size:100%覆盖掉。

posted @ 2012-09-12 16:43  唾手可得的树  阅读(526)  评论(0)  编辑  收藏  举报