-
對網頁中層的固定實現代碼
對于DIV+CSS不熟悉的我,為此加班加點在項目上線時把問題解決了。參考代碼如下: 復制代碼代碼如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/x...
作者:asdasdasd11-19 -
瀏覽器默認樣式
熟悉這些之后可以明白 一、使用CSS reset的原因。 二、*{margin:0;padding:0;}一刀切的做法為什么不提倡 三、網上廣泛流傳的CSSreset為什么也有人不提倡 從對比圖可以看出,不部分標簽其實是沒有...
作者:asdasdasd11-19 -
IE6的inline-block
1、display:inline-block 讓一個元素具有“區塊元素”的屬性(可以設置width和height),又具有“內聯元素”的屬性(不產生換行)。 2、IE中的inline-block IE6不支持這個屬...
作者:asdasdasd11-19 -
級聯樣式文件共通樣式整理
CSS Code復制內容到剪貼板
作者:asdasdasd11-19
/*<pre>:定義預格式化文本;<code>:用于表示計算機源代碼的文本內容;
*<fieldset>:可將表單內相關的元素分組;<legend>:為fieldset標簽定義標題;
... -
CSS教程:scrollbar的屬性知識及樣式分類介紹
1.overflow內容溢出時的設置(設定被設定對象是否顯示滾動條) overflow-x水平方向內容溢出時的設置 overflow-y垂直方向內容溢出時的設置 以上三個屬性設置的值為visible(默認值)、scroll、hid...
作者:asdasdasd11-19 -
css :nth-child與:nth-of-type之小解
讓我們看下面一段html: 復制代碼代碼如下: <section> <p>Little</p> <p>Piggy</p> <!-- 定位此元素--> </section> 下面的2種寫法都可以達到目的 復制代碼代碼如下: p:nth-child(2) { color: re...
作者:asdasdasd11-19 -
你不可不知的CSS選擇器
一、五大基本選擇符
作者:asdasdasd11-19
1. *(通配符)*通配符選擇器,經常用于css reset(樣式重置),清理標簽的默認樣式,但現在一般不提倡直接使用*了,主要是*會匹配所有標簽,相當耗資源。*在css的優先級中是... -
IE6/7 and IE8/9(Q)中td的上下padding失效的解決方法
如下 復制代碼代碼如下: <!DOCTYPE HTML> <HTML> <HEAD> <meta charset="utf-8"> <title>IE6/7 and IE8(Q) 中td的上下padding失效</title> <style> table { border:1px solid #555; } td { back...
作者:asdasdasd11-19 -
巧用CSS邊框 制作技能冷卻效果
在線演示:http://demo.jb51.net/js/2011/WarICONPrefect/index.htm上面的效果看起來還不錯吧。在網頁里,除了用Flash,我們還是有不少方法可以實現它。
作者:asdasdasd11-19
顯然這種效果不復雜,一張背景圖片... -
css 解決瀏覽器兼容問題
這里大家要知道CSS不兼容的原因是因為各瀏覽器給CSS默認屬性值不一樣造成的。 第一招:給常用CSS規定屬性值。 body,div,dl,dt,dd,ol,h1,h2,h3,h4,h5,h6,form,input,p,th,td{margin:0;padding:0;...
作者:asdasdasd11-19 -
CSS設置DIV Herf底層圖片和鏈接同時改變(兼容多瀏覽器)
/*CSS樣式設置 涂聚文 Geovin Du**/ 復制代碼代碼如下: .text8 { font-family: Arial, Helvetica, sans-serif; background-image: url(../images/05.jpg); height:42px; text-align:center; } ....
作者:asdasdasd11-19 -
使用font-size:0 來去掉inline-block元素之間的空隙方法
像下面圖中的布局,如果排列的元素是等高的話,相信很多人都會使用浮動來布局,不過如果元素不等高的話,不添加多余的標簽,浮動布局是很難實現下圖中的效果。如果遇到這種情況,可以使用inline...
作者:asdasdasd11-19 -
IE 元素默認高度研究
作者:asdasdasd11-19
序號
HTML
IE<=7 CSS樣式
表現:
實際高度 (px)
說明
1
... -
DIV+CSS 全屏垂直居中的一個辦法
例如下邊的例子! 我是先定了一個點在中間,然后再把里邊的這一塊居中處理;
作者:asdasdasd11-19
<style>
#info{height:0px; width:0px;top:50%; left:50%;position:absolute;}
#center{background:#FFCC33;bor... -
DIV+CSS通用樣式布局實例代碼
一下是一個非常簡單易懂的通用樣式布局,希望對于剛開始接觸DIV+CSS的同學有幫助。先看效果圖:
作者:asdasdasd11-19
我們可以看出通常的頁面布局有以下幾個部分:頭部、內容、底部,其中內容有左側主顯區和右側邊欄... -
用CSS代碼繪制三角形 純CSS繪制三角形的代碼
1、新建一個元素,隨便什么元素,不過我習慣性的會用塊元素來做。如果行內元素就display:block它。<div class="triangle"></div>2、把它的寬高設置為height:0px; width:0px;3、設置邊框border屬...
作者:asdasdasd11-19 -
浮動的ul背景及圖片的邊框的使用
今天遇到的問題整理: 1.ul中的li浮動時,無論給外層div的class寫背景,還是給ul寫背景,都是沒有效果的。這是因為li浮動時撐不起外層的高度。給li或者a加上display:block;也沒有用。解決方法是...
作者:asdasdasd11-19 -
深入display:inline-block
在使用 CSS 實現表現的時候,會經常接觸到 display:inline-block 這一屬性,無論是初接觸 Web 標準還是接觸標準已久的朋友,大都會對這一屬性感覺很迷惑和模糊。display:inline-block
作者:asdasdasd11-19
將對象呈遞... -
CSS模擬小箭頭的實現代碼
圖:HTML代碼: 復制代碼代碼如下: <div class="pre-wrap"> <div class="pre"> <div class="pre1"></div> <div class="pre2"></div> </div> </div> CSS代碼: 復制代碼代碼如下: .pre-wrap { wi...
作者:asdasdasd11-19 -
IE兼容css3圓角的實現代碼
讓我們棄新技術不用,是不可能的,因此找到了一種解決的辦法--- IE利用VML矢量可標記語言作為畫筆繪出圓角: 下載一個壓縮包ie-css3.htc,里面有一個微軟的腳本文件(11KB)和一個用來測試服務器...
作者:asdasdasd11-19 -
使用不帶單位的line-height
有的時候,我們為了實現單行文字的垂直居中,會給line-height一個和height相同的固定的值;有的時候,我們為了調整特定的某段文字的行間距,通常會考慮使用百分比或者相對尺寸的em。或許是習慣,...
作者:asdasdasd11-19 -
去掉checkbox邊框的方法(css)
<input name="a" type="checkbox" style="position:absolute;clip: rect(6 15 15 6)" checked="checked"> 關鍵:style="position:absolute;clip: rect(6 15 15 6)" 解釋: 此屬性定義了絕對(abs...
作者:asdasdasd11-19 -
用純CSS3打造立體提示模塊的效果實現(圖) 附源碼
最近一些日子都在看JS方面的書,寫小游戲,好久沒寫CSS了,昨天看了一個純CSS3進度條的例子,感覺很有創意,尤其是用background-size來repeat漸變斜線這招,妙不可言。今天再浩方打dota的時候刷...
作者:asdasdasd11-19 -
Web頁面中5種超酷的Hover效果分享
給平淡的站點帶來活力 hover效果能給網頁增加一些動態效果,并且使得站點更具有活力。原來的做法是使用javascript來實現這些動態效果,但是隨著CSS3的引入和現代瀏覽器的支持,我們可以用純粹的...
作者:asdasdasd11-19 -
絕對定位才是WEB的精髓
若是你從未碰到過此問題,并且非得用純CSS來實現,我想你一時半了也是束手無策吧。這里不討論如何實現的細節,網上關于此問題的解決方法也是層出不窮,但都有共同點:復雜,取巧。
作者:asdasdasd11-19
且不論...
