DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> DIV十CSS布局 >> 布局實例 >> CSS小技巧:隱藏input 內的文字的方法
CSS小技巧:隱藏input 內的文字的方法
編輯:布局實例     

隱藏input的方法在浏覽器中各不相同,我們用於網頁使用它時並不希望它改變本身內聯的屬性,現單獨分析如下:

首先寫一個公用樣式:
 


input{
 height:20px;
 width:50px;
}
 


1,IE6,IE7浏覽器

方法1
input{
 height:20px;
 width:50px;
  line-height:100em;
}
方法2
input{
 height:20px;
 width:50px;
  padding-top:60px;
}
方法3
input{
 height:20px;
 width:50px;
  line-height:8em;
}
方法4
input{
 height:20px;
 width:50px;
  font-size:80em;
}
方法5
input{
 height:20px;
 width:50px;
  line-height:25em;
}

2.FF浏覽器

方法1:
input{
 height:20px;
 width:50px;
  text-indent:-999px;
}

方法2:
input{
 height:20px;
 width:50px;
  font-size:0;
}

3.Opera浏覽器
方法1
input{
 height:20px;
 width:50px;
  padding-top:60px;
}
總結:從以上代碼看,沒有一個全適的樣式適合所有浏覽器,只能有針對性的加入HACK技術才可兼容各浏覽器了!
 

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved