CSS

word-wrap是控制換行的,可取：word-wrap:break-word normal break-all keep-allbreak-word：它主要用來是控制是否將強制把單詞換行，對於中英中文沒有任何問題，但是對於長串的英文無效。normal：英文單詞不被拆開，它是預設值。break-all，主要解決了長串英文的問題。主要用來是斷開單詞。在單詞到邊界時，下個字母自動到下一行。keep-all，是指對於中、日、單詞之間不斷詞。即只用此時，不用word-wrap，中文就不會換行了。（

1. 預設的內外邊距不同問題：各個瀏覽器預設的內外邊距不同解決：*{margin:0;padding:0;} 2. 水平置中的問題問題：設定 text-align: center   ie6-7文本置中，嵌套的塊元素也會置中ff /opera /safari /ie8文本會置中，嵌套塊不會置中解決：塊元素設定 1、margin-left:auto;margin-right:auto2、margin:0 auto;3、<div align=&

    最近在做項目中發現很多CSS代碼裡面都使用!important去覆蓋原有高優先順序的樣式。按照常理來說，越是靈活的東西，需要做的工作就會更多。所以 想當然的認為像!important這樣靈活、方便的規則如果用得多的話肯定會對效能有所影響。基於這種考慮，本來想把所有的這些樣式通過提高優先順序給去 掉的。不過後來一想，還是去google一下吧，猜想一般都是不可靠的。於是查到了這篇文章Is !important bad for performance?。下面是大概意思：

大家應該明白Float的作用了吧，就是為了消除塊狀元素“霸權主義”的一把利器！ 頁面配置有兩種方式1）浮動Float 2）定位Position今天就來一個小小的練習，讓大家理解Float的含義 【例子】要求：1）兩個方塊，一個紅色#900，一個藍色#009；2）紅色方塊寬度和高度均為200像素，藍色方塊

SEO（搜尋引擎最佳化）有很多工作要做，其中對代碼的最佳化是一個很關鍵的步驟。為了更加符合SEO的規範，下面中部IT網將對目前流行的CSS+DIV的命名規則整理如下： 頁頭:header 登入條:loginBar 標誌:logo 側欄:sideBar 廣告:banner 導航:nav 子導航:subNav 菜單:menu 子功能表:subMenu 搜尋:search 滾動:scroll 頁面主體:main 內容:content 標籤頁:tab 文章列表:list 提示資訊:msg

概要：本文主要描述XHTML中相對定位和絕對位置各自的本質、用法、區別和兩者之間的關係。以及使用CSS的Left、Right、Top、Bottom屬性（位移屬性）和Margin屬性（外邊距）對定位區塊層級元素進行布局的方法。(本文的樣本，請看這個附件demo。)說明：佔位空間：元素在文檔流中所佔據的空間。物理空間：元素本身所佔據的空間。下面分3種情況分別對相對定位和絕對位置進行討論：1.只使用css第一組屬性布局定位元素的情況2.只使用css第二組屬性布局定位元素的情況3.混合使用第一組和第二組

　　對於簡單的Web網站，可以只使用一個CSS檔案。對於大型的複雜網站，對樣式表進行分割以便簡化維護是一種好做法。如何分割樣式表是需要仔細考慮的。我一般用一個CSS檔案處理基本布局，用另一個檔案處理版式和設計修飾。這樣的話，在布局確定之後，就很少需要修改配置樣式表。這可以防止配置樣式表被意外地改動或破壞。　　還可以進一步細分，比如用單獨的CSS檔案處理顏色。這樣的話，如果希望提供新的顏色方案，就只需要建立一個新的顏色樣式表。如果網站上有許多表單，那麼可以用單獨的CSS檔案處理所有表單樣式。可以只

　　我接觸的很多人都問，如何學習Web標準製作網頁呢？我想每一個剛剛接觸web標準的人都會問這樣的問題，我就根據自己的經驗總結。　　1.不要一味使用DW等工具設計網頁，去熟悉(X)HTML語言和CSS語言　　因為web標準對代碼的要求提高了，沒有對xhtml代碼沒有一定的瞭解是無法通過校檢的。DW工具也可以使用，但是要看著代碼寫網頁了。　　首先是xhtml代碼，不是很多，知道他們如何使用，怎麼正確書寫，而且要記得封閉tag。如<img/><br/>。建議看看一些html參

　　CSS實現的網頁中文字排版的幾種方式！如果用得上可以直接用現成的了！1.文字倒排（逆時針轉90度）<br><br><span style="font-family:@宋體;color:red">盡人事 順天命</span><br><br>2.文字正寫豎排,中文豎排，從右往左讀<br><br><div style="layout-flow:

　　塊元素(block element)一般是其他元素的容器元素，塊元素一般都從新行開始，它可以容納內嵌元素和其他塊元素,常見塊元素是段落標籤'P"。“form"這個塊元素比較特殊，它只能用來容納其他塊元素。　　如果沒有css的作用，塊元素會順序以每次另起一行的方式一直往下排。而有了css以後，我們可以改變這種html的預設配置模式，把塊元素擺放到你想要的位置上去。而不是每次都愚蠢的另起一行。需要指出的是，table標籤也是塊元素的一種，table

在使用CSS實現表現的時候，會經常接觸到display:inline-block這一屬性，無論是初接觸Web標準還是接觸標準已久的朋友，大都會對這一屬性感覺很迷惑和模糊。display:inline-block將對象呈遞為內聯對象，但是對象的內容作為塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內，允許空格。但對於這個屬性不是所有瀏覽器都識別。支援的瀏覽器有：Opera、Safari但很遺憾，最流行的IE和Firefox卻不支援這個屬性（據說下一版本的Firefox將會支援display:inlin

Css不朽的經典—3D文字特效——這個是先用了一段白色的文字，再加了mask()濾鏡，再用了shadow()濾鏡，最後加入chroma()濾鏡形成後一段字型，放在前一段文字的相對left: -200px位置上形成的。效果：見附圖1原始碼：<style type="text/css"><!--.samplefont-style: italic; font-family: arial black;font-size:

當我們面對網站項目裡日益龐大的css，javascript檔案，無論是為了二次開發還是瀏覽器解析，都應該最佳化他們的代碼，但是最佳化並不意味著是簡單的壓縮或減小檔案體積。條理清晰，運行效率高才是我們要的結果。那麼有哪些手段能夠我們的css代碼呢？一起來看看下面的一些建議吧。1.使用縮寫縮寫能夠縮短你的工作時間，減小你的檔案體積，何樂而不為？針對相近的不同設定不同的值：view plaincopy to clipboardprint?p {　margin-top:

強制不換行div{white-space:nowrap;}自動換行div{word-wrap:break-word;word-break:normal;}強制英文單詞斷行div{word-break:break-all;}CSS設定不轉行：overflow:hidden 隱藏white-space：normal 預設pre 換行和其他空白字元都將受到保護nowrap 強制在同一行內顯示所有文本，直到文本結束或者遭遇 br 對象設定強行換行：word-break:normal ;

CSS布局執行個體:上中下三行布局，上下定高，中間欄自適應瀏覽器高度，且內容垂直置中。本文代碼在firefox 2.0 / win ie 6/ win ie 7 /opera 8.5 cn/win safari 測試通過。對於非ie核心瀏覽器，通過設定display:table、display:table-row和display:table-cell來類比表格的表現形式。最外層#box { display:table; }，高度100%，其子層#header/#main/#footer為{

CSS文法立意讓網頁內容與視覺呈現分離，一方面使得頁面維護工作更容易，不會因內容或視覺效果改變影響到另一方，這樣的頁面設計，也對搜尋引擎更為友善，更容易搜尋到頁面內容。CSS，Cascading Style Sheets串接樣式表，網頁外觀的控制文法World Wide

用慣了Windows的人對各種各樣的滑鼠樣式一定不會陌生。當滑鼠移動到不同的地方時，當滑鼠執行不同的功能時，當系統處於不同的狀態時，都會使滑鼠的形狀發生變化。而在網頁上往往只有當滑鼠在超級連結上時才出現一個手形，在其它地方似乎沒有什麼變化，同充滿動感的網頁顯得不怎麼和諧。實際上，用CSS可以方便地定義許多種滑鼠形狀。用本文介紹的方法，可以在網頁的作何地方設定滑鼠的不同樣式。在Dreamweaver中設定手形滑鼠樣式效果的製作步驟：1、按F7(或點擊快速啟動欄裡那個象“八卦圖&rdqu

這一段CSS代碼相當簡單，目的就是想用CSS來控制某段文字的顯示與隱藏。起初我採用了下面的代碼，令人不可思議的是，它們在我的IE6.0上居然沒有任何反應，大家不信可以親自實驗一下。<style type="text/css">a {font-size:12px;text-decoration:none;height:50;}a:hover {text-decoration:none;}a span

<!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

前言：這是筆者學習之後自己的理解與整理。如果有錯誤或者疑問的地方，請大家指正，我會持續更新！垂直置中用到的地方有很多，解決的方法也有很多。已知元素寬度 可以用position定位 + margin負值的方法絕對位置 + 4個方向全部0px + margin：auto 可以做到基於父容器水平垂置中；如果只需要垂直置中，那可以把left和right刪掉，並且水平置中的方法也很多絕對位置 + 左50% + margin左：寬度一半的負值 可以做到水平置中 右也可以絕對位置 + 上50% +