CSS

 　　你對DIV CSS網頁布局需要掌握的技巧是否熟悉，這裡和大家分享一下，良好的習慣可能會使你的設計周期加倍縮短。　　DIV CSS網頁布局需要掌握的技巧匯總　　以下是進行CSS設計時的八個必要的小技巧，良好的習慣可能會使你的設計周期加倍縮短。　　1.DIV

 　　title給文本輸入框添加背景 - www.cxybl.com/title STYLE TYPE=TEXT/CSS .bg { background-image:url(bgdemo2.jpg); /*如果想添加你的網站Logo，可將這兩行注釋啟用 background-repeat: no-repeat; background-position: center center; */ } /STYLE /head b  

   css對文字的布局上沒有靠容器底部對齊的參數，目前使用的一個不錯的方法也比較好.就是用position屬性來解決，看下面的代碼，用position的相對和絕對位置功能也輕鬆的實現了，文字靠近div低部對齊，並且靠近的距離還可以精確到像素，自己可以調節，是不是很不錯呢?   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

 　　您應該明白為什麼我會說到這個，選擇合適的、有意義的元素去描述你的內容，確保您所選擇的是富有語義的類class和id特徵值。做正確的事情會使你的生活變得容易很多，如果你是某個團隊的一分子，對團隊其他成員來說也是如此。看一下下面的這條規則： Webjx.Com　　.l13k { color: #369; }

　　一、 去除超級連結的底線以及在超級連結上實現滑鼠移至上方變色：　　在預設情況下，用DreamWeaver設計的網頁中的超級連結都有底線，看上去不大美觀。要去除這些討厭的底線,很多報刊介紹的方法都是在HTML原始碼中手工加入一段代碼，其實在DreamWeave中很容易去除連結的底線。首先在DreamWeaver的Document Windows中隨便建立一個連結，你可以看到這個連結會有底線。怎樣去除這條底線呢?　　1.在點擊功能表列上的"Text"|"CSS

　　CSS檔案的連結方式　　·附加連結：外部CSS檔案　　·匯入CSS：常用應用多個CSS檔案時，將多個CSS匯入一個CSS檔案中　　CSS規則定義有三種：　　1)類比如“.RedText”、“.BlueText”和“.BigText”等等　　2)標籤針對原有HTML標籤做的重新CSS定義　　3)進階偽類、定義了ID的元素，以及綜合性定義　　CSS規則的應用　　·只有“類

 　　一、代碼精簡　　採用DIV+CSS布局使代碼很精簡，這一點相信對此方法熟透的朋友都有所瞭解的都知道，css檔案可以在每一個網頁中使用，只要調用就可以，採用table表格修改一些頁面的話就很麻煩了，如果是一個門戶網站的話，要手動改很多頁面，而且看著那些表格也會感覺很亂也很浪費時間，但是這要是在css中只要改一個代碼就可以了　　二、表格嵌套　　使用Table布局，為了達到一定的視覺效果，不得不套用多個表格，這樣不僅表格會很多，還很亂;所以使用table為了達到很好的視覺效果，就要嵌套

 　　用CSS將圖片顯示成圓角的效果圖。　　看到了吧，這就是用純CSS實現的圓角化圖片，為了能看到透明化的效果，我特意應用了一個背景圖片，你可以下載本模型到你的電腦中，隨意伸縮視窗的大小，看看外圓角是否是透明的。　　有了這種效果，你再也不愁給每一張圖片作圓角的工作，這種效果在一些圖片類的示範頁面中經常見到，特別適用那些圖片比較多的列表中。怎麼樣，效果還可以吧!　　好了，我們來看看它的實現機制吧!　　實現原理：　　這種效果其實就是我在第二章中變體實現，下面講一講主要的關鍵代碼。　　主要變

 　　相信很多人都遇到過在設計中自訂捲軸樣式的情景，之前我都是努力說服設計師接受瀏覽器內建的捲軸樣式，但是這樣只能規避還是解決不了問題，最近在項目中遇到了，正好來總結一下。當然，相容所有瀏覽器的捲軸樣式目前是不存在的。　　IE下的捲軸樣式　　IE是最早提供捲軸的樣式支援，嗯，好多年了，但是其它瀏覽器一直沒有支援，IE獨孤求敗了。　　這些樣式規則很簡單：　　scrollbar-arrow-color: color; /*三角箭頭的顏色*/　　scrollbar-face-color:

 　　當前瀏覽器普遍支援的前提下，css被我們賦予了前所未有的使命。然而依賴css越多，樣式表檔案就會變得越大越複雜。與此同時，檔案維護和組織的考驗也隨之而來。 (曾幾何時)只要一個css檔案就夠了——所有規則(rule)匯聚一堂，增刪改都很方便——可這種日子早已遠去。(現在)建立新網站時，必須花點時間好好籌劃怎麼組織和架構css。　　檔案的組織　　構建css系統的第一步是大綱的擬定。(我認為)css組織規劃的重要性堪比網站目錄結構。(

 如何使DIV置中 主要的樣式定義如下：body {TEXT-ALIGN: center;}#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }說明：首先在父級元素定義TEXT-ALIGN: center;這個的意思就是在父級元素內的內容置中；對於IE這樣設定就已經可以了。但在mozilla中不能置中。解決辦法就是在子項目定義時候設定時再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto;

 CSS 解決覆蓋父元素透明度 的效果css相容瀏覽器的透明度寫法1.{opacity:0.3;filter:alpha(opacity=30);}css是不能做到相容覆蓋透明度的如果父元素設定了透明度,那麼子項目是不能比父元素的透明度高,所以可以用以下辦法實作類別似效果1.<div id="bgttt" style="opacity:0.3;filter:alpha(opacity=30);position:absolute;left:0;top:

 　　實現原理：　　這種效果其實就是我在第二章中變體實現，下面講一講主要的關鍵代碼。　　主要變化的還是背景圖片的定位，只是這一次與第二章中的有些不同，這次需要考慮到下面的兩個圓角的變化。　　先看看上面兩個圓角的實現：　　/*圖片位移定位--上面部分*/　　.sharp b.b2{background-position:-4px top;}　　.sharp b.b3{background-position:-2px -1px;}　　.sharp

 　　background-position:url(圖片) 水平(X) 垂直(Y)　　如果水平(X)為正數、垂直(Y)為負數，表示以圖片的右上方為座標，移動各個位移，如 8 -8 (以右上方，向右移8PX 向上移8px);　　如果水平(X)為負數、垂直(Y)為負數，表示以圖片的左上方為座標，移動各個位移，如 -8 -8 (以左上方，向左移8PX 向上移8px);　　如果水平(X)為正數、垂直(Y)為正數，表示以圖片的右下角為座標，移動各個位移，如 8 8 (以右下角，向右移8PX

 隨著CSS3的發布，國外研究正如火如荼，但在國內還有很多人抱著IE不支援CSS3的想法，始終無動於衷不肯去學習。但是曆史告訴我們，好的東西必將盛行，CSS3也終將也會替代CSS2，下面就和大家分享一個用CSS3打造的可摺疊樹狀菜單。樹狀菜單相信大家都不會陌生，我們一般用css+JS

 　　在看騰訊，新浪這些大網站的布局的時候，發現了一個問題，為什麼他們會把css直接掛在頁面上面，而不是分離開來作為一個css檔案link進去。　　這是應付超大流量的一種最佳化方案。　　為提高速度，他們的外部串連檔案一般都儲存在單獨的伺服器上，例如img.****.com，如果這個伺服器掛掉，整個首頁就掛掉了。放在頁面內，比較安全。使用者訪問頁面時，不會因為CSS載入不上，而造成裸頁面。　　那這樣做是不是增加了維護的成本?如果寫在頁面上，不便於修改和管理。　　他有可能是單獨的css檔案

 <style type="text/css">label{float: left;width: 80px;}form{margin:0px}input{width: 180px;border:1px solid #808080}textarea{width: 250px;height: 150px;}#sbutton{margin-left: 80px;margin-top: 5px;width:80px;}br{clear:

 三欄布局是目前最常見的網頁布局，主要頁內容放在中間一欄，邊上的兩欄放置導航連結之類的內容。基本布局一般是標題之下放置三欄，三欄佔據整個頁面的寬度，最後在頁的底端放置頁尾，頁尾也佔據整個頁面寬度。  絕大多數網頁設計者都熟悉傳統的網頁設計技術，用這些技術可以產生帶有表格、建立固定寬度布局或者“液態”（它可以根據使用者瀏覽器視窗寬度自動調整）布局的網頁。現在，我們都開始拋棄基於表格的布局技術，許多網路設計者正在從XHTML標記和CSS格式這一新

 畢業設計要做一個提示框：當滑鼠放在某個連結上時，下邊顯示有提示功能的表單。如下：具體代碼實現如下：CSS：代碼如下:.rhsyyhqDIV{position:absolute;top:555px;left:200px;font-size: 9pt;display:block;height:335px;width:405px;background-color:transparent;display: none;}s{position:absolute;top:-20px;left:50

 文字旁邊搭配圖片時，發現圖片比文字靠上，原來預設的情況是圖片頂對齊而文字底對齊，通過設定css屬性可以使得圖片與文字對齊。設定各對象的vertical-align屬性，屬性說明：baseline－將支援valign特性的對象的內容與基準對齊sub－垂直對齊文本的下標super－垂直對齊文本的上標top－將支援valign特性的對象的內容與對象頂端對齊text-top－將支援valign特性的對象的文本與對象頂端對齊middle－將支援valign特性的對象的內容與對象中部對齊bott