1、在網頁製作中padding:length是什麼
就是規定元素具體的內間隙數值,例如padding:3px padding:2em padding:1rem padding:0 等
2、請教一個關於移動端網頁製作的padding的問題,前端很常見的。
不需要減來減去的那麼麻煩,只需要一個CSS屬性即可:
div {上面這代碼的意思就是盒子的寬度width屬性將定義了內容區、內邊距和邊框的總寬度。
(而不再是默認的情況:width屬性只代表內容區的寬度)
如此,你就可以盡情地使用 padding、border 了,不用再考慮怎麼減來減去的,不論你設置了padding或border,都不會超出寬度的。
另外注意一下,IE7及更低版本的瀏覽器不支持該屬性(手機瀏覽器都支持)。
3、網頁設計中padding和文本縮進有什麼區別。
文本縮進是控制一個方向的,而padding是控制多個方向的。
4、網頁設計css布局問題
paddin:100px ,0px;
是上下100px 左右0px
padding:10px;
是上下左右各10
IE6 瀏覽器下 應該是有變化的。
火狐瀏覽器下 沒有版變化 因為padding值 超過了li的高權度
IE7應該是和火狐一樣的 這個我沒有測試 因為沒裝IE7
產生這個問題的原因是IE和火狐對於padding的解釋不同
IE會把padding值加到對象高度和寬度中,從而使對象變大
但是火狐不會這樣,他會把padding的值從對象高度寬度中扣除
對象實際大小不發生變化,可用大小發生變化。
IE7改變了許多地方,變的和火狐有些相像了。
5、網頁設計中的 padding: 0 10px 3px;是哈子意思啊 求解 非常感謝
padding:0 10px 3px;
等同於:
padding-top:0;
padding-left:10px;
padding-right:10px;
padding-bottom:3px;
6、網頁設計中默認外 內邊距是多少
這根據 不同HTML標記而異的。
一般是 0px
有些特殊標記 譬如 h1,h2,h3,h4,h5,h6,p,ul 等,默認就會有一定的外邊距。
7、請教網頁製作高手,固定了div的大小,更改div裡面content的padding值,為什麼div也會變?
width表示的是你的內容的寬度,而padding是內邊距,是除內容外的部分到邊線的距離,專margin是外邊距,是表屬示邊線外面與另一個盒子之間的距離。
不論你如何設置內邊距和外邊距,width如果寫好了,那麼放載內容的寬度始終是width的值。
但是,這整個的div占的地方就不一樣了。會隨著內邊距、外邊距、邊線、width的改變而改變。
如果你想讓這個div占的地方始終不變,那麼你需要給這個div裡面再寫一個div,並且不設置width和height,只寫內外的邊距,這樣,不論你如果設置裡面的div的內外邊距(只要總的大小不超出外面div的width和height),外面的div的大小都不會再改變了。
8、網頁設計CSS解釋
光說解釋,但不來知道解釋哪些部源分?我就將我覺得該解釋的說說吧。
以"#"開頭的成為id選擇器,在程序中用id="id名稱"調用;以"."開頭的成為類別選擇器,在程序中使用class="類別名稱"調用;二者實現效果一樣,只是在不同情況下按需選擇。此外還有標記選擇器和行內樣式兩種css樣式。
常用選項解釋:padding表示內邊距;margin表示外邊距;float表示浮動屬性(設置該屬性後可實現圖文混排);background-image表示背景圖片;background-repeat表示是否允許背景重復;border表示邊框;text-align表示文本水平居中顯示。
padding:10px 0px 0px 0px;從上開始表示順時針內邊距分別為10px,0px,0px,0px。margin和border的用法與padding類似,可以類推;
border-bottom:1px solid #CAEFC4表示下邊框為1px實線顏色為#CAEFC4。其他各邊以此類推。
差不多了吧,呵呵,祝你好運!
9、在網頁設計中,margin值和padding為負數是否合理?
margin使用負數比較常見,使用負數是為了讓標簽向某個方位縮進,這樣就不用加position屬性來定位了,例如多個div使用負數可以達到層疊的效果,有點類似多張白紙疊在一起的感覺
而padding使用負數的話,一般頁面效果會更差,至少我還沒想到怎樣的頁面布局需要用到padding的負數值
10、網頁設計導航條
下面的代碼,你去看看,不好用再說。
<!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>無標題文檔</title>
<style type="text/css">
<!--
body {
background-color: #0099FF;
}
#navigation {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#navigation ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navigation li {
border-bottom-style: none;
border-bottom-color: #ed9f9f;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-top-color: #ed9f9f;
border-right-color: #ed9f9f;
border-left-color: #ed9f9f;
float: left;
}
#navigation li a {
text-decoration: none;
display: block;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 0.5em;
border-right-width: 1px;
border-left-width: 12px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #711515;
border-left-color: #711515;
border-top-style: none;
border-bottom-style: none;
width: 50px;
text-align: center;
margin: 0px;
}
#navigation li a:link, #navigation li a:visited {
color: #FFFFFF;
background-color: #c11136;
}
#navigation li a:hover {
color: #ffff00;
background-color: #990020;
}
#navigation ul li:hover ul,#navigation ul a:hover ul {
visibility: visible;
}
#navigation ul ul {
visibility: hidden;
}
#navigation ul ul li {
clear: both;
}
#navigation ul ul li a {
border: 1px solid #CCCCCC;
}
#navigation ul ul li a:link, #navigation ul ul li a:visited {
color: #000000;
background-color: #FFCC66;
}
#navigation ul ul li a:hover {
color: #006699;
background-color: #99CC00;
}
.nav {
border: 1px solid #0099CC;
position: absolute;
width: 357px;
left: 112px;
top: 34px;
}
.nav ul {
margin: 0px;
padding: 0px;
list-style-type: none;
font-size: 12px;
}
.nav li {
float: left;
}
.nav li a {
border: 1px solid #FF3333;
display: block;
padding: 5px;
background-color: #FFCC33;
text-decoration: none;
}
-->
</style>
</head>
<body>
<div id="navigation">
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">關於我們</a></li>
<li><a href="#">產品展示</a>
<div>
<ul>
<li><a href="#">產品1一</a></li>
<li><a href="#">產品2一</a></li>
<li><a href="#">產品3一</a></li>
<li><a href="#">產品4一</a></li>
<li><a href="#">產品5一</a></li>
<li><a href="#">產品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">聯系電話</a>
<div>
<ul>
<li><a href="#">產品1一</a></li>
<li><a href="#">產品2一</a></li>
<li><a href="#">產品3一</a></li>
<li><a href="#">產品4一</a></li>
<li><a href="#">產品5一</a></li>
<li><a href="#">產品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">公司介紹</a></li>
</ul>
</div>
</body>
</html>