html中legend设置大小,HTML_如何给 legend 标签设定宽度,我们在做表单的时候经常会使 - phpStudy...
如何給 legend 標(biāo)簽設(shè)定寬度
我們?cè)谧霰韱蔚臅r(shí)候經(jīng)常會(huì)使用到這樣的結(jié)構(gòu):
哪些瀏覽器legend標(biāo)簽設(shè)定的寬度有效
IE6
IE7
Firefox2
Firefox3
Opera9.0+
Safari3.0+
當(dāng)我們使用 CSS 給 legend 標(biāo)簽設(shè)定固定寬度時(shí):legend {
background:red;
width:500px;
}
在 IE6、IE7、Opera9.0+、Safari3.0+ 都正能常顯示,而在 Firefox2 和 Firefox3 中寬度卻失效。
在這里我們不去深究為什么,只探討解決的方法:
我們可以通過(guò)在 legend 標(biāo)簽內(nèi)添加一個(gè)標(biāo)簽,并給標(biāo)簽設(shè)定所需要的寬度,此寬度的單位不可為百分比(%):
HTML 修改為:
哪些瀏覽器legend標(biāo)簽設(shè)定的寬度有效
IE6
IE7
Firefox2
Firefox3
Opera9.0+
Safari3.0+
CSS 修改為:
legend span {
background:red;
width:500px;
display:block;
}
可參考:《how to set width of LEGEND tags in FF》
正淳 同時(shí)也提供了另外的一種解決方案,無(wú)需修改結(jié)構(gòu),僅修改樣式即可:
legend {
background:red;
text-indent:-600px;
padding-left:600px;
/*IE下還原初始方式,只設(shè)定寬度*/
*width:600px;
*text-indent:0;
*padding-left:0;
}
題外話(huà):CSS 的兼容其實(shí)并不難,多嘗試多實(shí)踐就可以解決,最重要的是自己要去動(dòng)手,只有動(dòng)手了才會(huì)有更多的收獲,才會(huì)有更深的印象
本文作者:相關(guān)閱讀:
php正則表達(dá)式的模式修正符和逆向引用使用介紹
javascript版的日期輸入控件(2)
用VBS實(shí)現(xiàn)監(jiān)視進(jìn)程創(chuàng)建與刪除的代碼
網(wǎng)頁(yè)文字實(shí)現(xiàn)豎排的幾種方法
javascript最常用與實(shí)用的創(chuàng)建類(lèi)的代碼
SupeV影音播客系統(tǒng)SupeV產(chǎn)品特點(diǎn)
Javascript 面向?qū)ο?命名空間
Mysql如何避免全表掃描的方法
基于jquery的jqDnR拖拽溢出的修改
QQ For Linux 1.0 Preview 搶先測(cè)評(píng)
SQL Server數(shù)據(jù)庫(kù)的鎖類(lèi)型總結(jié)
Panel加樣式有時(shí)候無(wú)法浮動(dòng)的問(wèn)題
十天學(xué)會(huì)php之第六天
asp.net下日期加減的方法
總結(jié)
以上是生活随笔為你收集整理的html中legend设置大小,HTML_如何给 legend 标签设定宽度,我们在做表单的时候经常会使 - phpStudy...的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: android 美颜 技术点,《Andr
- 下一篇: 科软2020计算机科学与技术,2020新