Time of Update: 2017-02-28
文章簡介:html5–為語義和體驗而生。 開篇前的一些YY曾幾何時,一個人出設計稿,出完設計稿開啟DW用拖出一個頁面,再苦逼一點拖完頁面後自己還要寫後台,武林人稱:美工。更苦逼的是當每一次需求變更後,去修改一大堆發麻的,於是"div+css"被搬上了互連網時代的舞台,一夜間N多的《DIV+CSS》葵花寶典橫空出世,那時,我們活在了div+css的年代,那時,我們用上了
Time of Update: 2017-02-28
文章簡介:我們使用:before來在元素的前面插入內容,使用:after在元素的後面插入內容(相容瀏覽器:firefox、chrome、safari、opera、ie8+)。 在css中,我們可以使用:before虛擬元素選取器與:after虛擬元素選取器在頁面的前面和後面以content屬性的方式插入內容。從css2.0添加這兩個虛擬元素選取器到css2.1到現在的3.0,都不斷的在對這兩個選取器進行改良和擴充。首先,我們來看一下,在css2中,我們如何來插入內容(ie6
Time of Update: 2017-02-28
文章簡介:網頁設計經驗分享;沒有CSS時網頁的可看性. 先上樣本,首頁酒店模組的效果圖如下:代碼結構如下:<dl>< dt>酒店</dt>< dd>北京</dd>< dd>上海</dd>< /dl>< ul>< li>北京酒店列表</li>< li>北京酒店列表</li>< li>上海酒店列表</li&
Time of Update: 2017-02-28
文章簡介:負margin是好東西. 上個月完成的項目,舉個讓我糾結N小時的模組,先上圖:預設狀態為灰色,不帶圓圈,完成狀態為紅色,當前進行中顯示為黃色,並且圓圈在兩個字中間,最後一個狀態“成功”如果為灰色,線條要小於文字,但其它部分要連貫。原型代碼如下,為了JS結構當然越簡單越好:<ul>< li class=“status_finished”>選擇</li>< li
Time of Update: 2017-02-28
文章簡介:完美解決IE6不支援hover的方法. <style type=”text/css”> p:hover,p.hover { background:#eee; } /* 就是要多寫一個.hover而已 */ </style> 下面這段代碼要放到頁面的底部在</body> 前: &
Time of Update: 2017-02-28
文章簡介:並且當數字或者英文中帶有漢字時,會從漢字處換行,而純漢字卻可以自動換行。這個問題如何解決?先來認識一下兩位主角word-wrap和word-break。 當一個定義了寬度的塊狀元素中填充的全部為純英文或者純數位時候,在IE和FF中都會撐大容器,不會自動換行並且當數字或者英文中帶有漢字時,會從漢字處換行,而純漢字卻可以自動換行。這個問題如何解決?先來認識一下兩位主角word-wrap和word-breakword-wrap用來控制換行兩種取值:(1)normal (
Time of Update: 2017-02-28
文章簡介:清理浮動有很多種方式,像使用 br 標籤內建的 clear 屬,使用元素的 overflow,使用空標籤來設定 clear:both 等等。但考慮到相容問題和語義化的問題,一般我們都會使用如下代碼來清理浮動。 清理浮動有很多種方式,像使用 br 標籤內建的 clear 屬,使用元素的 overflow,使用空標籤來設定 clear:both 等等。但考慮到相容問題和語義化的問題,一般我們都會使用如下代碼來清理浮動。/* 清理浮動
Time of Update: 2017-02-28
文章簡介:利用CSS讓元素垂直置中是個很頭疼的問題,這裡就介紹兩種簡單實用的方法。
Time of Update: 2017-02-28
文章簡介:今天我將重溫這個主題然後向你展示使用background-image的方法可以實現多少效果。我將向你展示如何使用box-shadow、border-radius 和 transition 來創作不同的圖片風格。 譯自:CSS3 Image Styles中文:CSS3圖片樣式請尊重著作權,轉載請註明來源,多謝~~直接在圖片元素上直接應用CSS3 inset box-shadow 或
Time of Update: 2017-02-28
文章簡介:W3C CSS2.1的 4.1.3 節中提到:標識符(包括選取器中的元素名,類和ID)只能包含字元[a- zA-Z0-9]和ISO 10646字元編碼U+00A1及以上,再加連字號(-)和底線(_);它們不能以 數字,或一個連字號後跟數字為開頭。它們還可以包含逸出字元加任何ISO 10646字元作為一個數 作業系統版本:Windows 7瀏覽器版本:IE6,IE7,IE8,Firefox 3.6.2,Safari 4.0.4,Chrome 5.0.356.2
Time of Update: 2017-02-28
1.樣式代碼#layout { position:absolute; top:50px; width:500px; background:#fff; filter: alpha(opacity=70); opacity: 0.7;}1.快顯視窗出現灰色透明背景,內容層不能操作.定義兩個層:<div style="background:red; filter: alpha(opacity=45); opacity:0.45; position:absolute;top:
Time of Update: 2017-02-28
<!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"&g
Time of Update: 2017-02-28
<html> <head> <title>純CSS無圖片帶箭頭的DIV方框</title> <style> div.container{position:absolute; top:30px; left:40px; font-size: 9pt; display:block; height:100px; width:200px;
Time of Update: 2017-02-28
從上到下 body{FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);} 二、從左上至右下漸層 body{FILTER: Alpha( style=1,opacity=25,finishOpacity=100,startX=50,finishX=
Time of Update: 2017-02-28
<style type="text/css"> body { font-size:14px; font-family:"宋體"} ol li { margin:8px} #con { font-size:12px; width:600px; margin:0 auto} #tags&nb
Time of Update: 2017-02-28
代碼如下: <script> function bgChange(obj) { objobj.bgColor=obj.bgColor==""?"#B6DC73":""; } </script> <table width="80%" border="1" bgcolor="#ffffcc"> <tr
Time of Update: 2017-02-28
最近在訪問一個網站的時候,我注意到,當其文字被選中時它有一個匹配他的網站的背景色,這個背景色通常是深藍色。現在,如果您的網站不使用任何藍色為文字背景,看上去會不會有點不合適? 當尋找如何?這一點的解決辦法後,我感到驚喜,這竟然非常容易。只需添加以下的CSS到您的網頁: ::selection{background: #A8141B; color: white; /* Safari */} ::-moz-selection{background: #A8141B; color:
Time of Update: 2017-02-28
使用CSS可以固定背景,格式如下: 標籤名{background-attachment:參數} 參數: fixed:頁面滾動時,背景固定; scroll:頁面滾動時,背景滾動。 執行個體: <html> <style type="text/css"> <!-- p.1{ background-attachment:fixed;
Time of Update: 2017-02-28
連結元素的所有CSS屬性可以合并為:a { text-decoration: none; background: url(underline.gif) repeat-x 100% 100%; padding-bottom: 4px; white-space:
Time of Update: 2017-02-28
當讀到一個樣式表時,瀏覽器會根據它來格式化 HTML 文檔。插入樣式表的方法有三種:1、外部樣式表當樣式需要應用於很多頁面時,外部樣式表將是理想的選擇。在使用外部樣式表的情況下,你可以通過改變一個檔案來改變整個網站的外觀。每個頁面使用 標籤連結到樣式表。 標籤在(文檔的)頭部:css" href="mystyle.css"