Time of Update: 2017-01-13
大家都見過用CSS定義的各色的input按鈕,但對於select卻無法用定義input的簡單方式來實現。下面提供另外一種css定義的方式來讓你的select炫起來。CSS部分: 代碼如下複製代碼 .select * { margin: 0; padding: 0;}.select { border:1px solid
Time of Update: 2017-01-13
由於項目中編寫文檔結構、編寫CSS的人員較多,並與程式員協同工作,就需要統一class與id的名稱,前天花了一點時間,按照大多人的習慣,制定了下面的常用關鍵字:容 器:container/box 頭 部:header 主 導 航:mainNav 子 導 航:subNav 頂 導 航:topNav 網站標誌:logo 大 廣 告:banner 頁面中部:mainBody 底 部:footer 菜 單:menu 菜單內容:menuContent 子 菜 單:subMenu
Time of Update: 2017-01-13
■繼 承 和 層 疊CSS規則影響元素的顯示形態,但是如果沒有樣式匹配或者存在多種樣式規則同時匹配該元素時,元素顯示的形態到底是遵循哪個規則呢?本節論述的內容涉及到樣式的繼承和層疊方面的知識。●繼 承有些樣式通過預設的樣式設定而“繼承”,也就是說,子項目繼承父元素的樣式規則,包括color、font和text-align等等。例如:p { color: red }...<p>Sample paragraph with
Time of Update: 2017-01-13
一、Margin(框距)padding(邊框距)margin屬性設定順序:上右下左padding屬性設定順序:上右下左margin:25px 0 25px 0;簡寫:margin:25px 0;二、Display顯示內容設定(1)、Display屬性none (隱藏).alt {display:none;}<span class=”alt”>Content List Part</span>(2)、Display屬性block (塊/地區)Img
Time of Update: 2017-01-13
CSS檔案先準備 還是先寫好HTML檔案?網上有很多種答案:先寫HTML後寫CSS;先寫CSS後寫HTML;兩者同時寫。 我的準則是先寫HTML打好基礎,然後再寫CSS進行表現的控制! 對於初學者我建議兩者一起寫,先寫CSS或者先寫HTML對於初學者都不是恰當得的方法。 如果讓一個人編寫代碼,你告訴他先寫HTML,寫完後 HTML不能修改了,然後你寫CSS,如果他可以寫出來,那這個人一定是一個水平非常高的Builder了!所以對於初學者,多數情況下我建議同時編寫,具體我說一下步驟:
Time of Update: 2017-01-13
css自動換行有什麼技巧?大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 CSS如何將他們換行的方法! 大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 CSS如何將他們換行的方法! 對於div 1.(IE瀏覽器)white-space:normal; word-break:break-all;這裡前者是遵循標準。 代碼如下複製代碼 #wrap{white-space:normal; width:200px;
Time of Update: 2017-01-13
ID與CLASS怎麼用,在標題中有提及使用原則與技巧,這裡的使用原則與技巧是我的經驗總結,並非摘自哪本典籍,所以並不是什麼權威論述,請各位網友在看到這篇文章時需要有主見的閱讀,不要被我的妖言所迷惑。 ID與CLASS的使用原則 據說W3C對於ID與CLASS的設定是ID具有唯一性,CLASS具有普遍性。所以我們這裡的使用原則也是依據這一特性建立的。 ID是不能重複的,所以在XHTML的結構中,大結構一定是用ID。比如標誌、導航、主體內容、著作權。這些呢接我自己制定的規範命名為#logo
Time of Update: 2017-01-13
一種是把CSS文檔放到<head>文檔中: <style type=“text/css”> …… </style> 其中<style>中的“type='text/css’”的意思是<style>中的代碼是定義樣式表單的。 另一種方法是把CSS樣式表寫在HTML的行內,比如下面的代碼: <p style=“font-size:14pt;color:blue”>藍色14號文字</p> 這是採用<Style=“
Time of Update: 2017-01-13
style="filter:濾鏡名(屬性1=值1,屬性2=值2......)"其中,“濾鏡名”就是你在DW樣式設定模組的濾鏡下拉式清單中看到的名稱,屬性值只需填入數字即可。下面是DW所提供的主要幾個濾鏡的功能說明:(以下二組表格採用了“盒子”、“邊框”、“區塊”、“類型”等CSS樣式)Alpha:設定透明層次blur:建立高速度移動效果,即模糊效果Chrom
Time of Update: 2017-01-13
CSS selector 選擇符是我們進行CSS網頁布局的基礎。CSS selector到底有哪些,如何合理的運用呢?選擇符可以分為三類,除了第一類HTML selector之外,其它兩類我們是可以自己命名的,在進行命名時,注意包含語義,或者添加必要的注釋,使我們的代碼更清晰,易讀。 HTML selector 標籤選擇符 HTML selector就是HTML的標籤,如:DIV,TD,P,H1等等,如你用
Time of Update: 2017-01-13
瀏覽器安全色手冊javascript,cssjavascript部分1. document.form.item 問題問題:代碼中存在 document.formName.item("itemName") 這樣的語句,不能在FF下運行解決方案:改用 document.formName.elements["elementName"]2. 集合類對象問題問題:代碼中許多集合類對象取用時使用(),IE能接受,FF不能解決方案:改用 []
Time of Update: 2017-01-13
先來兩段代碼,一段是HTML代碼,一段是CSS代碼,下面的分析都是在這兩段代碼的基礎上進行。HTML代碼: 代碼如下複製代碼 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html
Time of Update: 2017-01-13
對文本的處理新增了兩個新屬性word-wrap和word-break來解決這個問題:{word-break:break-all;} :依照亞洲語言和非亞洲語言的文本規則,允許在字內換行,且允許非亞洲語言文本行的任意字內斷開 {word-wrap:break-word;}: 內容將在邊界內換行,如需要則詞內換行(word-break)也行發生 IE6/7/8[1] Firefox2/3[2]
Time of Update: 2017-01-13
現在大部分都是用!important來hack,對於ie6和firefox測試可以正常顯示,但是ie7對!important可以正確解釋,會導致 頁面沒按要求顯示!找到一個針對IE7不錯的hack方式就是使用“*+html”,現在用IE7瀏覽一下,應該沒有問題了現在寫一個CSS可以這樣: 代碼如下複製代碼 #1 { color: #333; } /* Moz */* html #1 { color: #666; } /* IE6 */*+html #1
Time of Update: 2017-01-13
先看IE7+、Firefox、Opera的代碼: 代碼如下複製代碼 <style type="text/css">#backTop { position : fixed; bottom : 0 ; right:0;}</style> 在IE6中,需要一些CSS Hack來解決它,需要增加: 代碼如下複製代碼 <!--[if IE 6]><style
Time of Update: 2017-01-13
區別IE6與FF:background:orange;*background:blue;區別IE6與IE7:background:green !important;background:blue;區別IE7與FF:background:orange; *background:green;區別FF,IE7,IE6:background:orange;*background:green !important;*background:blue;註:IE都能識別*;標準瀏覽器(如FF)不能識別*;IE6
Time of Update: 2017-01-13
一、UL邊距的問題Ul裡邊margin和padding的預設值不是0,所以在嵌套li的時候如果指定了li的數值,可能把外部的div撐大,所以如果要使用ul的 時候要指定margin和padding為0,如下ul{margin:0px; padding:0px;} 二、圖片設定的問題現在很多網站都盡量把背景圖片放置在一張圖片上然後利用background-postion來取得背景圖片,這樣大大的減少了圖片的大小也最佳化了
Time of Update: 2017-01-13
CSS可以參照如下定義,注意順序: 代碼如下複製代碼 #menu { line-height: 23px; }/* firefox 瀏覽器實行這句定義 */#menu { line-height: 26px9; }/*ie6,ie7,ie8 這句定義主要尖對IE8來hack*/#menu { *line-height: 23px; }/*ie6,ie7 這句定義主要尖對IE7來hack*/#menu { _line-height: 23px; }/*ie6
Time of Update: 2017-01-13
在寫 CSS 的時候,用 background:url(#) 還是會對頁面進行多一次請求的。不過,因為寫多 CSS,一般需要用空背景來解決 bug 的時候,測試結果用 background:url(about:blank) 才是我們想要的:解 bug,不影響效能。那很簡單,解決方案不就不出來?等等,讓我們來做個測試吧。解決方案是:大膽使用 about:blank 來代替空,或者‘#’,特別是在 background-image 中使用 在 img /
Time of Update: 2017-01-13
代碼如下複製代碼 <title>DIV 水平置中</title> <style> div#wrap