這個可以另外插入一個文本框和瀏覽按鈕,把文件輸入框隱藏,然后用自行插入的文本框和按鈕模擬文件輸入框的功能。只是需要加入一些js事件來同步。
目前創(chuàng)新互聯(lián)公司已為上千多家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)絡(luò)空間、網(wǎng)站托管維護(hù)、企業(yè)網(wǎng)站設(shè)計、荷塘網(wǎng)站維護(hù)等服務(wù),公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略,正道將秉承"和諧、參與、激情"的文化,與客戶和合作伙伴齊心協(xié)力一起成長,共同發(fā)展。
[img]CSS是Cascading Style Sheet 的縮寫。譯作「層疊樣式表單」。是用于(增強)控制網(wǎng)頁樣式并允許將樣式信息與網(wǎng)頁內(nèi)容分離的一種標(biāo)記性語言。鏈入外部樣式表文件 (Linking to a Style Sheet) 你可以先建立外部樣式表文件(.css),然后使用HTML的link對象。示例如下: head titletitle of article/title link rel=stylesheet href=" " type="text/css"/head 而在XML中,你應(yīng)該如下例所示在聲明區(qū)中加入: ? xml-stylesheet type="text/css" href=" " ?定義內(nèi)部樣式塊對象 (Embedding a Style Block) 你可以在你的HTML文檔的HTML和BODY標(biāo)記之間插入一個STYLE.../STYLE塊對象。 定義方式請參閱樣式表語法。示例如下: html style type="text/css" !-- body {font: 10pt "Arial"} h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon} h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue} p {font: 10pt/12pt "Arial"; color: black} -- /style body 請注意,這里將style對象的type屬性設(shè)置為"text/css",是允許不支持這類型的瀏覽器忽略樣式表單。 內(nèi)聯(lián)定義 (Inline Styles) 內(nèi)聯(lián)定義即是在對象的標(biāo)記內(nèi)使用對象的style屬性定義適用其的樣式表屬性。示例如下: 這一行被增加了左右的外補丁 樣式表語法 (CSS Syntax) Selector { property: value } 參數(shù)說明: Selector -- 選擇符 property : value -- 樣式表定義。屬性和屬性值之間用冒號(:)隔開。定義之間用分號(;)隔開 繼承的值 (The ' Inherit ' Value) 每個屬性都有一個指定的值:Inherit。它的意思是:將父對象的值等同為計算機值得到。這個值通常僅僅是備用的。顯式的聲明它可用來強調(diào)。 選擇符說明: #表示選擇id .表示選擇class 比如我有個 這時就得用#test{屬性}來給id為test的div來制定樣式 而 則應(yīng)該用.test{屬性}來給其指定樣式。 編輯本段根據(jù)分辨率不同,調(diào)用不同的css文件 dotted; TABLE-LAYOUT: fixed; BORDER-TOP: #cccccc 1px dotted; BORDER-LEFT: #cccccc 1px dotted; BORDER-BOTTOM: #cccccc 1px dotted" cellSpacing=0 cellPadding=6 width="95%" align=center border=0 SCRIPT LANGUAGE="javascript" !-- if (window.navigator.userAgent.indexOf("MSIE")=1) { var IE1024=""; var IE800=""; var IE1152=""; var IEother=""; ScreenWidth(IE1024,IE800,IE1152,IEother) }else{ if (window.navigator.userAgent.indexOf("Firefox")=1) { file://如果瀏覽器為Firefox var Firefox1024=""; var Firefox800=""; var Firefox1152=""; var Firefoxother=""; ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother) }else{ file://如果瀏覽器為其他 var Other1024=""; var Other800=""; var Other1152=""; var Otherother=""; ScreenWidth(Other1024,Other800,Other1152,Otherother) } } function ScreenWidth(CSS1,CSS2,CSS3,CSS4){ if ((screen.width == 1024) (screen.height == 768)){ setActiveStyleSheet(CSS1); }else{ if ((screen.width == 800) (screen.height == 600)){ setActiveStyleSheet(CSS2); }else{ if ((screen.width == 1152) (screen.height == 864)){ setActiveStyleSheet(CSS3); }else{ setActiveStyleSheet(CSS4); }}} } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } ; /SCRIPT 解釋: var IE1024=""; var IE800=""; var IE1152=""; var IEother=""; 引號里面分別填寫,用戶使用IE的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名. var Firefox1024=""; var Firefox800=""; var Firefox1152=""; var Firefoxother=""; 引號里面分別填寫,用戶使用FF的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名. var Other1024=""; var Other800=""; var Other1152=""; var Otherother=""; 引號里面分別填寫,用戶使用其他瀏覽器的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名. 不判斷分辨率,只判斷瀏覽器 應(yīng)E.Qiang提議,編如下代碼。實現(xiàn)根據(jù)瀏覽器類型自動調(diào)用不同CSS。 代碼: SCRIPT LANGUAGE="javascript" !-- if (window.navigator.userAgent.indexOf("MSIE")=1) { file://如果瀏覽器為IE setActiveStyleSheet("default.css"); }else{ if (window.navigator.userAgent.indexOf("Firefox")=1) { file://如果瀏覽器為Firefox setActiveStyleSheet("default2.css"); }else{ file://如果瀏覽器為其他 setActiveStyleSheet("newsky.css"); } } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } ; /SCRIPT 解釋: 如果瀏覽器為IE,則調(diào)用default.css 如果瀏覽器為Firefox,則調(diào)用default2.css 如果瀏覽器為其他,則調(diào)用newsky.css 用法:放在head/head中即可。 中國專業(yè)css標(biāo)準(zhǔn)化推廣網(wǎng)站 【Div之家】 css 層疊樣式表 引入層疊樣式表的方法包括: 1,外聯(lián)式樣式表 2,內(nèi)嵌樣式表 3,元素內(nèi)定 4,導(dǎo)入樣式表 外聯(lián)式樣式表 例:head link rel="stylesheet" href="/css/default.css" /head body .... /body /html 屬性:rel 用來說明link元素在這里要完成的任務(wù)是連接一個獨立的css文件。而href屬性給出了所要連接css文件的url地址 內(nèi)嵌式樣式表: 例:html head style type="text/css" !-- td{font:9pt;color:red} .font105{font:10.5pt;color:blue} -- /style /head body..../body /html 元素內(nèi)定 格式: 導(dǎo)入式樣式表 〈html head style type="text/css" !-- @import url(css/home.css); -- /style body .... /body /html
這個不能去除;
file是由一個text和一個button組合成的;既然這樣我們就用一個text和一個button來顯示這個file的樣式;
html
head
meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/
title定義input?type="file"?的樣式/title
style?type="text/css"
body{?font-size:14px;}
input{?vertical-align:middle;?margin:0;?padding:0}
.file-box{?position:relative;width:340px}
.txt{?height:22px;?border:1px?solid?#cdcdcd;?width:180px;}
.btn{?background-color:#FFF;?border:1px?solid?#CDCDCD;height:24px;?width:70px;}
.file{?position:absolute;?top:0;?right:80px;?height:24px;?filter:alpha(opacity:0);opacity:?0;width:260px?}
/style
/head
body
div?class="file-box"
form?action=""?method="post"?enctype="multipart/form-data"
input?type='text'?name='textfield'?id='textfield'?class='txt'?/??
input?type='button'?class='btn'?value='瀏覽...'?/
input?type="file"?name="fileField"?class="file"?id="fileField"?size="28"?onchange="document.getElementById('textfield').value=this.value"?/
input?type="submit"?name="submit"?class="btn"?value="上傳"?/
/form
/div
/body
/html
style
input{border:1px;}
.test{margin:0;padding:0;background:#f00;color:#fff;}
/style
input?class="test"?value="測試"
樣式里的input已經(jīng)把它的邊框設(shè)置為1,當(dāng)然你也可以把兩知樣式寫在一起,我只是為了讓你理解這種選擇器寫法。
樣式表一定是用的別人的,
url();
就只是一張圖片,是樣式表制作者本機上的(c盤里的)等同于下面這段代碼
.pagebg
{
background:
url(bg.jpg)};只不過圖片的路徑不同,
你隨便找一張圖片改名為bg.jpg;然后放在和樣式表同一目錄下再改background:
url();
這段代碼為
background:
url(bg.jpg)
你就可以看到圖片了,不過那只是你的圖片。估計道理你會懂,就是一張圖片路徑的問題。