                        課程
                    
                        /前端開發
                        
                            /HTML/CSS
                        
                        /網頁簡單布局之結構與表現原則

預覽結果完全和老師的不一樣

我只想說完全按照老師的代碼寫的，為是么結果不一樣？？使瀏覽器的問題？？？

FEBoy

2015-12-30

源自：網頁簡單布局之結構與表現原則 2-1

關注問題我要回答

889

操作

收起

4 回答

李曉健回答被采納 +3 積分
2015-12-30

<style?type="text/css">
????body,ul,ol,h1,h2,h3,h4,h5,h6,form,p,hr{margin:?0;padding:?0;list-style:?none;font:12px/1.5?"Arial",?"sans-serif",?"微軟雅黑",?"宋體",?"Tahoma";color:#666;}
????ul,ol{list-style:none;}

????.demo{width:600px;position:relative;}
????/**這行demo后面有一個空格***/
????.demo?.left{width:100px;float:left;}
????.tp{margin-left:20px;}
????/**這行demo后面有一個空格***/
????.demo?.right{width:458px;padding:20px;float:right;background:#9cf;border:1px?solid?#ccc;}
????/**這行demo后面有一個空格***/
????.demo?.right?p{font-size:12px;line-height:25px;}
</style>

看注釋

1 回復有任何疑惑可以回復我~

收起回答

FEBoy 提問者

噢，原來是這樣，謝謝了啊。麻煩再問下為是么要這樣寫，還有比如給<p>標簽加樣式，為是么不直接寫為p{font-size:12px;line-height:25px;},而是前面加上.demo .right呢？

2015-12-30 回復有任何疑惑可以回復我~

李曉健回復 FEBoy 提問者

加空格就是子選擇器，就是選擇這個標簽里面的標簽，沒有空格就是當前標簽

2015-12-30 回復有任何疑惑可以回復我~

FEBoy 提問者回復李曉健

想起來了，應該是包含選擇器，不是子選擇器。再次感謝！

2015-12-30 回復有任何疑惑可以回復我~

FEBoy 提問者
2015-12-30

<!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>Test</title>
<style?type="text/css">
body,ul,ol,h1,h2,h3,h4,h5,h6,form,p,hr{margin:?0;padding:?0;list-style:?none;font:12px/1.5?"Arial",?"sans-serif",?"微軟雅黑",?"宋體",?"Tahoma";color:#666;}
ul,ol{list-style:none;}

.demo{width:600px;position:relative;}
.demo.left{width:100px;float:left;}
.tp{margin-left:20px;}
.demo.right{width:458px;padding:20px;float:right;background:#9cf;border:1px?solid?#ccc;}
.demo.right?p{font-size:12px;line-height:25px;}
</style>
</head>

<body>
<div?class="demo">
??<div?class="left">
???<img?class="tp"?src="head01.jpg"?/>
??</div>
??<div?class="right">
???<h6>櫻桃小丸子</h6>
???<p>小雪封地，大雪封河，大雪節氣過后，小山村被厚厚的積雪覆蓋，?出山的路被冰雪封堵了，家家戶戶老早就備足了柴米油鹽醬醋茶，其中白薯是冬季山民的主食，而小米，玉米，高粱米則是稀缺的"細糧"。成長在山里的孩子，對白薯的記憶是最深刻的，兒時山里普遍窮，白薯是山民的主要口糧之一，長期吃白薯，難免吃頂了，有時我們不愛吃，大人們唬著臉說，不吃白薯的孩子長不了大個兒，于是，我們一群孩子就搶著吃了。</p>
????<span>10分鐘前</span>
??</div>
</div>
</body>
</html>