CSS

最近在研究CSS，正好結合項目做了一個靈活的Tab頁，使用純HTML＋CSS實現，正好總結一下。首先看一下預覽介面：範例HTML可以訪問：http://www.demo2do.com/htmldemo/school/attendance/AttendanceGlobal.html下面開始講述一下完成上述頁面的步驟。1.

CSS是層疊樣式表(Cascading Style

我們知道Dreamweaver在表格製作方面做得非常出色，但是在某些時候還是必須結合css才能達到一些特定效果，下面我們先把有關表格邊框的css文法整理出來，然後另外介紹怎樣用css美化表格的邊框。有關表格邊框的css文法具體內容包括：上邊框寬度、右邊框寬度、下邊框寬度、左邊框寬度、邊框寬度、邊框顏色、邊框樣式、上邊框、下邊框、左邊框、右邊框、邊框、寬度、高度、有關標籤等。1.上邊框寬度文法: border-top-width: <值>允許值: thin | medium |

由於CSS檔案載入於網頁的頭部，所以每位訪問者都會下載這些檔案。我們會對PHP檔案、圖片進行最佳化，而往往忽略了CSS檔案。今天我們應該思考這個問題並做點什麼。可以使用 CSS optimizers 來最佳化CSS, 但是我認為如果你使用下面提到的技巧編寫代碼時，效率和能力都會得到提高。最佳化CSS檔案還能節省流量同時提高頁面載入速度。1. 注釋編寫CSS時注釋顯得格外有用，這樣協同工作的同事就會理解代碼的含義。注釋方法有多種，你可以使用如下方法：/*-------------------*//

這幾天我在用Div+CSS進行網頁三列布局的時候突然想到的這樣一個方法，這個想法自己都覺得有些瘋狂，如果其中有什麼不對的地方還是請各位多多指教。當您需要寫一個三列布局的時候，一般情況下我會選擇使用如下的DIV布局方式：使用這樣的嵌套方式無疑可以使代碼出錯的機率減少很多，但同時這樣的布局也略顯複雜，對於後期的維護也略顯不便。我們在布局導航時經常會使用到一個方法，那就是使用 列表來進行布局，而導航可以形容為多列式的布局，既然如此，那麼我們也就可以使用來進行頁面的多欄版面配置。

雖然瀏覽器可能存在著很多Bug，但是並不是與自己感覺不一樣的時候就是出現了Bug。產生問題的原因可能有很多種，因此製作者需要一定的方法來排查問題。選擇一個先進的瀏覽器進行測試是明智的做法，例如對CSS 2.1支援比較好的Opera 9.2、Firefox 2.0或者Safari 3.0，而不要使用IE 6作為唯一的測試瀏覽器，因為IE 6的問題是最多的，這非常不利於製作者（特別是初學者）理解CSS

你正在學習CSS布局嗎？是不是還不能完全掌握純CSS布局？通常有兩種情況阻礙你的學習：第一種可能是你還沒有理解CSS處理頁面的原理。在你考慮你的頁面整體表現效果前，你應當先考慮內容的語義和結構，然後再針對語義、結構添加CSS。這篇文章將告訴你應該怎樣把HTML結構化。另一種原因是你對那些非常熟悉的表現層屬性(例如：cellpadding,、hspace、align="left"等等)束手無策，不知道該轉換成對 應的什麼CSS語句。

Css Reset是什麽?有些同行叫 "css複位",有些可能叫 "預設css".....相信看完全文您會對Css Reset有個重新的認識PS:程式碼* {padding: 0;margin: 0;}這就是最常用的Css Reset,但是這裡會有很多問題.原文前部分說了很多關於Css,以及各瀏覽器的css規則的不同,而制定"Css Reset"也是為了相容與統一,正確有效使用"Css

空間名稱和簡介地區#header ——主體部分—空間頭部的整個標題部分#header div.lc ——首頁左上方背景圖片#header div.rc—— 首頁右上方背景圖片#header div.tit ——空間名稱，即主標題，名字大小顏色#header div.tit a.titlink ——空間名稱連結，未被點擊#header div.tit

一、按鈕樣式.buttoncss {font-family: "tahoma", "宋體"; /*www.bianceng.cn*/font-size:9pt; color: #003399;border: 1px #003399 solid;color:#006699;border-bottom: #93bee2 1px solid;border-left: #93bee2 1px solid;border-right: #93bee2 1px

有時候，我們用CSS建立一個高度調適型配置，如何保證頁尾（footer）在內容不超過一屏的情況下始終保持在布局最下方是一個比較頭疼的事。我看過一些利用絕對位置的例子，但總感覺不是那麼完美，經過一下午的研究總結出一個利用負值外補丁的方法來實現這個效果的方法。下面我們看步驟：1、為了讓瀏覽器識別高度100%我們需要先給 html 和 body 加上一個高度值，同時清除所有元素的 margin 和 padding。順便提一下，經過我的測試，html 和 body 的 height: 100%;

widthheightmax-widthmax-heightmin-widthmin-heightposition - top、right 、bottom 、leftz-indexclipoverflow(overflow-x、overflow-y)scrollbar-base-colorscrollbar-face-colorscrollbar-track-colorscrollbar-arrow-colorscrollbar-shadow-colorscrollbar-darkshadow-

line-heightword-spacingletter-spacingtext-alignvertical-aligntext-indentwhite-spaceword-wrapword-breaktext-transformdirectionunicode-bidiwriting-modetext-decorationtext-underline-positiontext-justifylayout-flowlayout-gridlayout-grid-modelayout-grid-t

在瞭解XHTML代碼規範後，我們就要進行CSS布局。首先先介紹一些CSS的入門知識。如果你已經很熟悉了，可以跳過這一節，直接進入下一節。CSS是Cascading Style Sheets(層疊樣式表)的縮寫。是一種對web文檔添加樣式的簡單機制，屬於表現層的布局語言。1.基本文法規範分析一個典型CSS的語句：p {COLOR:#FF0000;BACKGROUND:#FFFFFF}其中"p"我們稱為"選取器"(selectors)，指明我們要給"

這一效果的主要屬性為：overflow。值：hidden！這樣就可以實現了！例如：width:300px;height:150px;overflow:hidden;表格寬300，高150。當表格中的內容超過這一設定值時，則自動隱藏！樣本如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

id用於標識頁面唯一元素，id的名稱是控制某一內容塊的手段，通過將某內容塊置入div並賦予唯一的id，就可以用CSS選取器來精確定義每一個頁面元素的外觀表現，包括標題、列表、圖片、連結或者段落等等。例如你為#header寫一個CSS規則，就可以完全不同於#content裡的圖片規則。可以通過不同規則來定義不同內容塊裡的連結樣式。類似這樣：#nav a:link或者 #main a:link或者#footer a:link。也可以定義不同內容塊中相同元素的樣式不一樣。例如，通過#main

以前我們面對這些有著順序或是有數字註明排序的內容時大多是在資料前自行加上一個數值，或是由程式加上這個數值。而如果使用有序列表則不需要這麼麻煩，根本不用自行去填寫序數，當單層列表的時候這種特性似乎並不明顯，而當使用多層的時候其特性就很明顯了。那麼還是先來瞭解一下有序列表的代碼形式：<ol><li>這就是列表的內容了，這是第一句</li><li>這就是列表的內容了，這是第二句</li><li>這就是列表的內容了，這是第三句<

有序無序單標籤很簡單，只要知道用法就行，但是關鍵點我認為不在於知道這個標籤長什麼樣，重點是在於什麼樣的資料適合使用什麼樣的列表。什麼樣的資料是有序的，什麼樣的資料是無序的？閱讀完要思考，這樣才能學到東西，知識才能是自己的。定義列表其形式特別，用法也很特別，相比較無序列表來說用到定義列表的就少很多。也有很多朋友還沒有開始使用這個列表，那麼下面就來分解一下這個列表的代碼：<dl><dt></dt><dd></dd></dl>看上

1、導覽功能表使用圖片、FLASH導覽功能表使用圖片、FLASH當然比純文字來得好看一些，但是搜尋引擎並不認識你的圖片和FLASH。如果你非要使用漂亮的圖片來做導航的話，可以使用背景替換的方法（我會在下次談到這一個方法的）；如果你要使用FLASH做導航，那我就沒你辦法了。建議做一個導覽功能表連結的xml文提交到搜尋引擎。2、不恰當地使用圖片為了網頁美觀，經常會到處貼滿圖片，這樣做是不正確的，與內容無關的圖片能少就少吧。我們可以把這些圖片做成容器的背景。3、內容裡特殊字型的運用我承認楷體很漂亮，草

div+css布局中段落使用<p>標籤，對於段落的上下左右的空白（縮排）可以使用margin標籤定義樣式。margin有上、下、左、右四個方向的定義，正常情況下，我們可以用一行來描述我們需要的樣式。例如：margin: 20px 8px 8px