Why this list text cannot inherit the color blue of p?
It seems inheritance works for color but when I try to inherit the color its anchestor p, the list cannot take the color..Why does inheritance not work in this case?
<!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>CSS (1)</title>
<style type="text/css">
p#parag{color:#009;}
</style>
</head>
<body>
<p id="parag">
<ul id="nav">
<li>test</li>
</ul>
</p>
</body>
</html>
<ul>
is a block-level element.
<p>
cannot contain block-level elements - from the HTML 4.01 spec:
The P element represents a paragraph. It cannot contain block-level elements (including P itself).
So the browser is attempting to fix this error and produces this HTML:
<p id="parag"></p>
<ul id="nav">
<li>test</li>
</ul>
<p></p>
The solution is to simply change the <p>
to a <div>
.
<ul>
(block level) is not valid within a <p>
tag - no block levels allowed within <p>
tags!
http://webdesign.about.com/od/htmltags/p/bltags_paragrap.htm
精彩评论