Time of Update: 2018-12-07
原理:通過存取cookie和dom操作調用不同的樣式表檔案來實現前台換膚.換膚樣本下載:sour.rarHtml代碼部分:1.要有一個帶id的樣式表連結,我們要通過操作這個連結來調用不同的href.<link href="css/main0.css" rel="stylesheet" type="text/css" id="cssfile" />2.皮膚選擇按鈕(後台為每個li添加onclick事件,觸發換膚功能)<ul id="skin"> <li
Time of Update: 2018-12-07
眾所周知 IE6 不支援 position:fixed ,這個 bug 與 IE6 的雙倍 margin 和不支援 png 透明等 bug 一樣臭名昭著。如何讓 position:fixed 在 IE6 中工作的?本文所使用的技巧是用了一條 Internet Explorer 的 CSS 運算式 (expression) 。你不可以直接使用該運算式,因為它可能會因為緩衝而不更新。解決這一點的最簡單的方式是使用 eval 包裹你的語句。如何解決“震動”的問題?顯然 IE
Time of Update: 2018-12-07
近來Windows
Time of Update: 2018-12-07
<span style="cursor:hand">手 形</span> <span style="cursor:crosshair">十 字</span> <span style="cursor:text" >文本游標</span> <span style="cursor:wait" >等 待</span> <span style="cursor:default" >默
Time of Update: 2018-12-07
有時候,我們用CSS建立一個高度調適型配置,如何保證頁尾(footer)在內容不超過一屏的情況下始終保持在布局最下方是一個比較頭疼的事。我看過一些利用絕對位置的例子,但總感覺不是那麼完美,經過一下午的研究總結出一個利用負值外補丁的方法來實現這個效果的方法,相容IE5.0+,Opera 8.5+,Firefox 1.5+。下面我們看步驟: 1、為了讓瀏覽器識別高度100%我們需要先給 html 和 body 加上一個高度值,同時清除所有元素的 margin 和
Time of Update: 2018-12-07
CSS樣式命名規範一.檔案命名規範全域樣式:global.css;架構布局:layout.css;字型樣式:font.css;連結樣式:link.css;列印樣式:print.css;二.常用類/ID命名規範頁 眉:header內 容:content容 器:container頁 腳:footer版 權:copyright 導 航:menu主導航:mainMenu子導航:subMenu標 志:logo標 語:banner標 題:title側邊欄:sidebar圖 標:Icon注 釋:note搜 索
Time of Update: 2018-12-07
傳統載入外部JavaScript(*.js) 或者 Css(*.css)檔案的方法是直接在<head>標籤裡面進行添加:<head> <script type="text/javascript" src="myscript.js"></script> <link rel="stylesheet" type="text/css" href="main.css" />
Time of Update: 2018-12-07
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html;
Time of Update: 2018-12-07
function $import(path,type,title){ var s,i; if(!type) type=path.substr(path.lastIndexOf(".")+1); if(type=="js"){ var ss=document.getElementsByTagName("script"); for(i=0;i<ss.length;i++){ if(ss[i].src &&
Time of Update: 2018-12-07
之前老弄不明白,只能憑藉一點短期內“虐出來的經驗”製作需要的效果,後來仔細研究了一下Hutia的XScroller,並且仔細看了文檔,才知道這個position屬性其實是指本體對上級的定位。如果這麼理解,就好辦了。預設的屬性值都是static,靜態。就不用多說了。最關鍵的是relative(相對)以及absolute(絕對)。往往我們如果是COPY別人的代碼,會把absolute屬性與left、top配合起來製作相關的“懸浮層”效果。然而有時候我們需要針對某一個容器的懸浮效果,而不是針對視窗的。
Time of Update: 2018-12-07
float的div一定要閉合。例如:(其中floatA、floatB的屬性已經設定為float:left;)<wrapper> <div id="floatA"></div> <div id="floatB"></div> <div id="NOTfloatC"></div>
Time of Update: 2018-12-07
今日整理網站的 CSS 的時候發現我的網站在 Firefox下面出現了變形的情況,這個時候我急啊.我就到網上找了很多資料,最後發現下面的內容比較實用:熟悉CSS的朋友一定對CSS hack十分瞭解了,現在IE瀏覽器、Firefox瀏覽器、Chrome瀏覽器、Opera瀏覽器、Safari瀏覽器百家爭鳴,可苦了我們這些Web前端開發人員了。我在這裡稍微整理了一下前面瞭解的各瀏覽器的CSS hack,打包奉獻一下,哈哈。各瀏覽器CSS
Time of Update: 2018-12-07
IE系列 filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF0000',endColorStr='#F9F900',gradientType='0');參數:startColorStr起始顏色 endColorStr結束顏色 gradientType為0時代表垂直,為1時代表水平 Firefox background: -moz-linear-gradient(top, #FF0000, #F9F900);
Time of Update: 2018-12-07
背景 background css 說明 background-image:url("圖片的網址"); 背景圖 background: url(" 圖片的網址 "); 背景 background-color:#色碼; 背景色彩 Exp: background-image:url(背景圖案.jpg,gif,bmp); background-color:#FFFFFF; background-color : transparent; <--設定背景為透明色
Time of Update: 2018-12-07
Two Column FlexibleBrowsers: ' ' ' ' (5+) Description: Probably the easiest page to make. Contains two layout divs, the main content div is just floated to the left. Very simple! Actions: View | Image Preview | Download [ 5k] [ZIP] Two Column
Time of Update: 2018-12-07
<!-- 把下列代碼加入到head區內 --><style>.highlightit img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}.highlightit:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity:
Time of Update: 2018-12-07
CSS網頁布局,說難,其實很簡單。說它容易,往往有很多問題困擾著新手,介紹了非常多的技巧,這些小技巧與知識能事半功倍的給大家以協助。然而更多的時候,我們往往被一些小問題纏著不能輕鬆。今天向大家介紹八個技巧,這些技巧顯得很有用。 一、若有疑問立即檢測 在出錯時若能對原始代碼做簡單檢測可以省去很多頭痛問題。W3C對於XHTML與CSS 都有偵查工具可用,請見 http://validator.w3.org
Time of Update: 2018-12-07
使用 line-height 垂直置中line-height:24px;使用固定寬度的容器並且需要一行垂直置中時,使用 line-height 即可(高度與父層容器一致),更多的垂直置中總結可以看這裡。清除容器浮動#main { overflow:hidden;}期前也提到過這樣的問題,更多資訊可以看這裡。不讓連結折行a { white-space:nowrap;}上面的設定就能避免連結折行,不過個人建議長連結會有相應的這行(有關換行方面的討論,參看圓心的記錄)。始終讓
Time of Update: 2018-12-07
一、按鈕樣式.buttoncss { font-family: "tahoma", "宋體"; /*www.52css.com*/ font-size:9pt; color: #003399; border: 1px #003399 solid; color:#006699; border-bottom: #93bee2 1px solid; border-left: #93bee2 1px solid; border-right: #93bee2 1p
Time of Update: 2018-12-07
CSS的十八般技巧最近,經常有朋友問我一些工作中遇到的CSS問題。他們總是不能很好的控制CSS,影響CSS的效率發揮。我來分析總結一下錯誤所在,協助大家更加容易使用CSS。本文總結了我開始使用CSS布局方法以來所有的技巧和相容方案,我願意把這些與你分享,我會重點解釋一些新手容易犯的錯誤(包括我自己也犯過的),如果你已經是CSS高手,這些經驗技巧可能已經都知道,如果你有更多的,希望可以幫我補充。一.使用css縮寫使用縮寫可以協助減少你CSS檔案的大小,更加容易閱讀。css縮寫的主要規則請參看《常用