Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

Change History

Message: [CSS] 搜尋列(input type="submit")高與寬的控制:中華民國司法院首頁為例

Changed By: HP
Change Date: September 26, 2011 05:21PM

[CSS] 搜尋列(input type="submit")高與寬的控制:中華民國司法院首頁為例
相容性觀察說明及截圖:http://mepopedia.com/forum/read.php?804,15128,15168#msg-15168
--

「搜尋列」主要<form>這個功能構成,裡面包括兩個部份

1. 文字輸入列:<input type="text">

2. 「送出」按鈕:<input type="submit">

而瀏覽器呈現「高與寬」的差異主要就是在對以上三者解讀不同所造成的。

IE submit default settings:<pre>
input[type="button"], input['type="submit"] {
padding: 1px 8px;
border: 3px;
margin: 0;
}
</pre>
Firefox submit default settings:<pre>
input[type="button"], input['type="submit"] {
padding: 0 6px;
border: 3px;
margin: 0;
}
</pre>
Chrome submit default settings:<pre>
input[type="button"], input['type="submit"] {
padding: 1 6px;
border: 2px;
margin: 2px;
}

以司法院首頁為例,&lt;form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14
}</pre>

以司法院首頁為例,&lt;form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14
Changed By: HP
Change Date: September 26, 2011 05:05PM

[CSS] 搜尋列 type="submit")bmit")高與寬的控制:中華民國司法院首頁為例
相容性觀察說明及截圖:http://mepopedia.com/forum/read.php?804,15128,15168#msg-15168
--

「搜尋列」主要&lt;form>這個功能構成,裡面包括兩個部份

1. 文字輸入列:&lt;input type="text">

2. 「送出」按鈕:&lt;input type="submit">

而瀏覽器呈現「高與寬」的差異主要就是在對以上三者解讀不同所造成的。

efault settings:<pre>
input[type="button"], input['type="submit"] {
padding: 0 6px;
border: 3px;
margin: 0;
}
</pre>
Chrome submit default settings:<pre>
input[type="button"], input['type="submit"] {
padding: 1 6px;
border: 2px;
margin: 2px;
}
argin: 0;
}
</pre>
Chrome submit default settings:<pre>
input[type="button"], input['type="submit"] {
padding: 1 6px;
border: 2px;
margin: 2px;
}

以司法院首頁為例,&lt;form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14}</pre>

以司法院首頁為例,&lt;form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14

Original Message

作者: HP
Date: August 03, 2011 01:17AM

[CSS] 搜尋列bmit")高與寬的控制:中華民國司法院首頁為例
相容性觀察說明及截圖:http://mepopedia.com/forum/read.php?804,15128,15168#msg-15168
--

「搜尋列」主要<form>這個功能構成,裡面包括兩個部份

1. 文字輸入列:<input type="text">

2. 「送出」按鈕:<input type="submit">

而瀏覽器呈現「高與寬」的差異主要就是在對以上三者解讀不同所造成的。

argin: 0;
}

Chrome submit default settings:

input[type="button"], input['type="submit"] {
padding: 1 6px;
border: 2px;
margin: 2px;
}

以司法院首頁為例,<form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14}


以司法院首頁為例,<form>所代表的版面模型為:

IE:

Firefox5:
寬:150 高:46 Margin-bottom: 14

Chrome12:
寬:150 高:52 Margin-bottom: 14