CSS布局實例：隱藏input文字_DIV+CSS實例
教程Tag：暫無Tag,歡迎添加,賺取U幣!
我們來看下面的代碼，成功的實現(xiàn)了隱藏input 文字。但分為三種情況，我們在后面進(jìn)行分析。
[ 可先修改部分代碼 再運行查看效果 ]
我們需要非凡注重的是下面的代碼：
我們看下面的分析：
第一種方法
在opera上有問題
第二種方法
假如這個值太小了在opera上文字還是可見，所以設(shè)置大一些就沒問題了，但FF中又會出現(xiàn)把高度撐大的現(xiàn)象；
第三種方法
這種方法應(yīng)該說是兼容性最好的
FF有點bt.在padding的時候，IE，OPEAR的高度與寬度都不變，就FF變。
代碼調(diào)試框 [hl5o.cn]
[ 可先修改部分代碼 再運行查看效果 ]
我們需要非凡注重的是下面的代碼：
示例代碼 [hl5o.cn]
input {
margin:5px 0;
width:200px;
height:20px;
display:block;
overflow:hidden;
background:#f9f9f9;
border:1px solid orange;
}
margin:5px 0;
width:200px;
height:20px;
display:block;
overflow:hidden;
background:#f9f9f9;
border:1px solid orange;
}
我們看下面的分析：
第一種方法
示例代碼 [hl5o.cn]
input.a {
ie:expression(bb.value="提交");
text-indent:-200em;
}
ie:expression(bb.value="提交");
text-indent:-200em;
}
在opera上有問題
第二種方法
示例代碼 [hl5o.cn]
input.b {
padding-top:20px;
}
padding-top:20px;
}
假如這個值太小了在opera上文字還是可見，所以設(shè)置大一些就沒問題了，但FF中又會出現(xiàn)把高度撐大的現(xiàn)象；
第三種方法
示例代碼 [hl5o.cn]
input.c {
font-size:100em
}
font-size:100em
}
這種方法應(yīng)該說是兼容性最好的
FF有點bt.在padding的時候，IE，OPEAR的高度與寬度都不變，就FF變。
相關(guān)DIV+CSS實例：
- 固定div容器的寬高，圖片居中（圖片不限制大小）
- 用css制作有滾動條的居中彈出框
- 鼠標(biāo)指住(hover)變色的按鈕演示demo
- 10個很酷的涂鴉風(fēng)格國外網(wǎng)店設(shè)計展示
- jquery模擬瀏覽器滾動條效果
- 仿谷歌google的搜索框下拉提示列表效果
- JS顯示網(wǎng)頁最后更新時間
- CSS技巧：text-indent隱藏文字(以圖換字)
- CSS實例：三列自適應(yīng)等高且中列寬度自適應(yīng)
- DivCSS布局實例：很實用的圖文混排CSS列表-富有語義
- DivCSS實例：CSS菜單Flash效果用圖片模擬實現(xiàn)
- DivCSS布局實例用dldtdd來制作列表
- 相關(guān)鏈接：
- 教程說明：
DIV+CSS實例-CSS布局實例：隱藏input文字
。