亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

設置padding為什么不起作用

代碼如下,看到大家說塊級元素默認與父級元素同寬,那么我理解為系統默認內容寬度width與父級同寬,而padding為0px。于是我將width調整為200px,這個時候調整padding為10px,沒有用。這是什么原因?

?

另外嘗試使用另外<p>,發現在<p>中設置padding是有用的。

?

但是!

?

當定義了width的值,同時多打幾個字,文本長了起來,竟然超越了border。這又是何解?難道右padding自動變負值?

?

<!DOCTYPE HTML>

?

<html>

?

<head>

?

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

?

<title>寬度和高度</title>

?

<style type="text/css">

?

li{

?

??? width:200px;

?

?

?

??? border:1px dotted #ccc;

?

??? padding=10px;

?

??? margin:10px;

?

}

?

p{

?

??? border:1px solid #ccc;

?

??? padding:50px;

?

??? width:40px;

?

??? background:pink;

?

}

?

</style>

?

</head>

?

<body>

?

<ul>

?

??? <li>別讓不會說話害了你</li>

?

??? <li>二十七八歲就應該有的見識</li>

?

??? <li>別讓不好意思害了你</li>

?

</ul>

?

<p>123fasddfadsfasdfdadfadfadafdsczxcdw</p>

?

</body>

?

</html>

?

結果如下

http://img1.sycdn.imooc.com//56e4348d0001992f04610297.jpg

正在回答

8 回答

是padding:10px;你打錯了。。。你的是padding=10px;

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

我們的洗手間 提問者

非常感謝!
2016-03-12 回復 有任何疑惑可以回復我~

第一個問題大家都幫你解決了,你的第二個問題呢,首先你輸入的都是英文,而且你設置的寬度太短所以會溢出,當然你也可以讓他自動換行,不過這個時候你要給他設置一個屬性,word-wrap:break-word;就可以實現自動換行了,當然你也可以不設置這個屬性,把字母都換成中文 他也會實現自動換行。

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

我們的洗手間 提問者

多謝你的回答!
2016-04-21 回復 有任何疑惑可以回復我~
#2

憶_卿 回復 我們的洗手間 提問者

客氣,我也在學 - - 碰到了兩個問題,一直找不出原因。。。大學沒認真學,現在又得學。。
2016-04-21 回復 有任何疑惑可以回復我~

我知道為啥了 因為你那是一個完整的單詞 你試試中文就知道了

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

我們的洗手間 提問者

確實,好神奇!
2016-03-13 回復 有任何疑惑可以回復我~

?<!DOCTYPE HTML>

?

<html>

?

<head>

?

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

?

<title>寬度和高度</title>

?

<style type="text/css">

?

li{

?

? ? width:200px;

? ? border:1px dotted #ccc;

? ? padding:10px; ?/* padding=10px;這個錯了*/

? ? margin:10px;?

}

?

p{

? ? border:3px solid black;

? ? padding:50px;

? ? width:40px;

? ? height:200px;

?

? ? background:pink; ?

? ?overflow:auto; ? /*超出范圍的以滾動條顯示*overflow:hidden;多出的內容隱藏/

?

}

?

</style>

?</head>

?<body>

?

<ul>

? <li>別讓不會說話害了你</li>

? <li>二十七八歲就應該有的見識</li>

? <li>別讓不好意思害了你</li>

</ul>

?

<p>123fasddfadsfasdfdadfadfadafdsczxcdw123fasddfadsfasdfdadfadfadafdsczxcdw123fasddfadsfasdfdadfadfadafdsczxcdw</p>

?

</body>

?

</html>

?


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

我們的洗手間 提問者

非常感謝!
2016-03-12 回復 有任何疑惑可以回復我~

代碼敲錯了應該是padding:10px ?不是padding=10px

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

定義需要用“:”而不是“=”,所以是padding:10px;

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

你設置了一個房子,然后給房子了填充超過房子的容量,當然會溢出!默認從左到右

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

我們的洗手間 提問者

既然設置了width,就不能自動轉下一行嗎?
2016-03-12 回復 有任何疑惑可以回復我~
#2

Feater 回復 我們的洗手間 提問者

好吧,是你打錯的原因,我是從結果超前來考慮的
2016-03-12 回復 有任何疑惑可以回復我~

因為你的width只有40

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

舉報

0/150
提交
取消

設置padding為什么不起作用

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號