CSS

先搞清基本概念：px就是表示pixel，像素，是螢幕上顯示資料的最基本的點；而pt就是point，是印刷行業常用單位，等於1/72英寸。

0，引言每每有新項目，第一步就是應當使用一個reset.css來重設樣式。濫用不如不用，直接拿個現成的reset.css過來將導致後期各種離奇bug的發生。所以最好還是自己寫一個reset.css，並且要明白每一條reset都是用來做什麼的。reset.css本意就是重設樣式，我始終建議把.clearfix放入layout.css,而把h1、h2之類的定義放進typography.css。 具體如何規劃網站CSS結構，不在文本討論之列，可以參考Smashing

css

css|教程 1. position:static|無定位position:static是所有元素定位的預設值, 一般不用註明，除非有需要取消繼承的別的定位example: 以下是引用片段：>#div-1 {  position:static; }2.

css|中文 文字倒排（逆時針轉90度）：運行代碼框1.文字倒排（逆時針轉90度）<br><br><span style="font-family:@宋體;color:red">盡人事 順天命</span><br><br>2.文字正寫豎排,中文豎排，從右往左讀<br><br><div style="layout-flow:

css|翻頁 純CSS實現翻頁效果，原理比較簡單，書籤配合隱藏。運行代碼框<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">&

css 定位一直是WEB標準應用程式中的痛點，如果理不清楚定位那麼可能應實現的效果實現不了，實現了的效果可能會走樣。如果理清了定位的原理，那定位會讓網頁實現的更加完美。定位的定義：在CSS中關於定位的內容是：position:relative | absolute | static | fixedstatic 沒有特別的設定，遵循基本的定位規定，不能通過z-index進行層次分級。relative 不脫離文檔流，參考自身靜態位置通過

css|條件|網頁

css|網頁|樣式表 1.標籤在Mozilla中預設是有padding值的,而在IE中只有margin有值.2.同一個的class選擇符可以在一個文檔中重複出現,而id選擇符卻只能出現一次;對一個標籤同時使用class和id進行CSS定義,如果定義有重複,id選擇符做的定義有效.3.一個相容性調整(IE和Mozilla)的笨辦法:初學可能會碰到這樣一個情況:同樣一個標籤的屬性在IE設定成A顯示是正常的,而在Mozilla裡必須要設成B才能正常顯示,

css|樣式表 現在IE7已經推出一段時間並且滲透到使用者當中，不用等太久我們就可以在頁面上使用更進階的CSS。兩個最有用的項目將是 Child子和Adjacent

移動端h5響應式方案最近這幾年用得最多的最多的就是rem方案了。這個需要計算根項目的font-size來實現響應式。本文主要和大家介紹了px單位html5響應式方案的相關資料，希望能協助到大家。但這種方案也有一個缺點，那就是font-size不為整數的時候一些字型使用rem單位會導致字型顯示的大小有問題，對視覺還原要求比較高的項目來說這還是令前端開發挺頭疼的一件事的。解決前端響應式無非就是在不同的裝置下可以正常展示，這裡介紹一種不需要rem方式的響應式方案。直接使用px，這裡說的是基於750px

這次給大家帶來css3做出半圓弧線，css3做出半圓弧線的注意事項有哪些，下面就是實戰案例，一起來看一下。本文介紹了css3實現畫半圓弧線的範例程式碼，分享給大家，具體如下：css代碼.circle1 { width: 100px; height: 200px; border: 1px solid black; border-radius: 100% 0 0 100%/50%; border-right: none;}.circle2 { width: 200

漸層是是以背景圖的形式呈現在頁面中的， 漸層的本質是background-image 。在css3中，漸層可以分為線性漸層（linear-gradient）和放射狀漸層（radial-gradient）。線性漸層是沿著漸層線進行漸層，而放射狀漸層則是沿著橢圓或者圓形進行四周漸層。2.線性漸層linear-gradient2.1 基本文法background-image: linear-gradient( [ <angle> | <side-or-corner> ,]? &

可能很有小夥伴看到標題都不知道是什麼意思，hideFocus即隱藏聚焦，具有使對象聚焦失效的功能，其功能相當於： onFocus=this.blur() 它的是一個布爾，如hideFocus=true。也可省略賦直接寫hideFocus。 今天我們就給大家詳細介紹下css中關於hideFocus的使用詳解！css中hideFocus的用法簡單說：hideFocus是對超連結外虛線框的設定！hideFocus即隱藏聚焦，具有使對象聚焦失效的功能，其功能相當於：

transparent是透明的意思，實際上background預設的顏色就是透明的屬性一般使用情境：如果一個元素覆蓋在另外一個元素之上，而你想顯示下面的元素，這時你就需要把上面這個元素的background設定為transparent有時我在看css時,看到有的css屬性定義為background:transparent。意思就是背景透明。實際上background預設的顏色就是透明的屬性。所以寫和不寫都是一樣的

這兩天寫的都是小知識點 因為確實有點忙 雖然很簡單，但是本著全面總結的原則，還是要說一下 今天我來說一下這個CSS中的盒模型 以及CSS3中可以改變盒模型的屬性盒模型盒模型是計算元素尺寸的模型規則 在我們CSS中盒模型分為兩種W3C標準盒模型正常情況下我們用的都是這個標準的盒模型 標準盒模型中元素尺寸使用如下計算方式 元素實際寬度 = width + padding（左右內邊距大小） + border（左右邊框大小） 元素實際高度 = height + padding（上下內邊距大小） +

最近我想修改一下這個網站，我想在上面放置一個提示框。這是很容易，但我想讓提示框上有一個三角形的箭頭。可是，一想到這需要使用圖片，並且各種顏色，各種方向的箭頭要準備無數種，這幾乎是一種災難。幸運的是，MooTools的核心開發著Darren Waddell告訴了我一個非常棒的技術：用CSS繪製三角形箭頭。使用純CSS，你只需要很少的代碼就可以創作出各種瀏覽器都相容的三角形箭頭！CSS代碼/* create an arrow that points up */p.arrow-up {

本篇文章主要介紹了CSS3自訂捲軸樣式的範例程式碼，內容挺不錯的，現在分享給大家，也給大家做個參考。捲軸是個很常見的東東，不過某些瀏覽器內建的捲軸確實不太好看啊，下面可以作為學習，探討下自訂捲軸的實現，這樣你的捲軸就可以美美的啦。但是，也只能玩玩，因為只針對webkit核心的瀏覽器啊啊啊啊啊！overflow介紹定義：overflow 屬性指定當它溢出其塊級容器時,是否剪輯內容，渲染捲軸或顯示內容。屬性值overflow:visible

這篇文章主要給大家介紹了利用CSS3實現自訂Checkbox特效的相關資料，文中給出了完整的執行個體代碼供大家參考學習，相信對大家學習自訂Checkbox樣式具有一定的參考價值，感興趣的朋友們下面來一起看看吧。前言大家都知道CheckBox是在HTML中讓使用者與首頁上的素材發生互動作用的一種方法。所謂CheckBox控制項就是我們一般所說的複選框，通常用於某選項的開啟或關閉。最近在工作中遇到一個需求，需要自訂checkbox的樣式，最終實現了好幾種樣式，所以想著分享出來給大家，有需要的朋友們可

    常常在css書上或上網逛的時候看到很多設計很好的網站，當然最經常做的事就是加入收藏夾，但是常常裝系統的時候忘了儲存收藏夾。所以今天就把常上的css網站網址貼出來，做個備忘。一、作品類網站</p>    1，http://www.csszengarden.com/        網頁設計領域最著名的網站    2，http://www.dark-i.com/        根據網頁配色尋找優秀網頁    3，http://w3csites.com/