CSS

OOCSS 和 BEM出於以下原因，我們鼓勵使用 OOCSS 和 BEM 的某種組合：可以協助我們理清 CSS 和 HTML 之間清晰且嚴謹的關係。可以協助我們建立出可重用、易裝配的組件。可以減少嵌套，降低特定性。可以協助我們建立出可擴充的樣式表。OOCSS，也就是 “Object Oriented CSS（物件導向的CSS）”，是一種寫 CSS 的方法，其思想就是鼓勵你把樣式表看作“對象”的集合：建立可重用性、可重複性的程式碼片段讓你可以在整個網站中多次使用。參考資料：Nicole

selector :first-child 這個是後代選取器. 怪異, 注意避免而不是理解.selector:first-child 當前 selector 選中的元素集合中的第一個元素selector:last-child當前 selector 選中的元素集合中的最後一個元素.但是有問題, :last-child 不生效.應該是:1 當前 selector 的父元素 parent2 parent所有子項目, [a,b,c]3 子項目的集合的第一個元素, 如果是 selector4 設定樣式,

準備環境node1:192.168.139.2node2:192.168.139.4node4:192.168.139.8node5:192.168.139.9node1 作為target端node2 node4 node5 作為initiator端並且將node2 node4 node5安裝cman+rgmanager後配置成一個三節點的RHCS高可用叢集，因為gfs2為一個叢集檔案系統，必須藉助HA高可用叢集將故障節點Fence掉，及藉助Message

CSS中transform 屬性允許你修改CSS可視化模型的座標空間。通過transform，可以讓元素進行移動（translate）、旋轉（rotate）、縮放（scale）、傾斜（skew）。 如果該屬性有一個非none值, 將會產生一個層疊上下文. 在這種情況下 對象將作為它包含的 position: fixed 元素的包含塊（a containing block）。文法/* Keyword values */transform: none;/* Function values

"position","top","right","bottom","left","z-index","display","float","width","min-width","max-width","height","min-height&quo

.sq_start { position: absolute; bottom: 10%; left: 50%; z-index: 3; margin-left: -50px; width: 100px; height: 20px; font-size: 18px; background: -webkit-gradient(linear,left top,right top,color-stop(0, #549A66),color-stop(0

有時候在寫CSS的過程中，某些限制總是不起作用，這就涉及了CSS樣式覆蓋的問題，如下#navigator { height: 100%; width: 200; position: absolute; left: 0; border: solid 2 #EEE;}.current_block { border: solid 2 #AE0;}尋找一些教材中（w3schools等），只說css的順序是“元素上的style” > “檔案頭上的style元素”

0.對自身可視寬度的影響1>改變處於標準文檔流中，未設定width值的block元素的可視寬度在標準文檔流中，對於沒有設定寬度的block元素，當其具有內容或者設定高度後，其自身寬度為父元素寬度的100%，這個時候給block元素設定水平方向的margin值，就會改變元素的可視寬度。但是不能改變高度，因為block元素的高度是固定或者等於其內容的高度，並不會展開。這個特點在bootstrap的布局裡就有用到。<p class="wrap">

compass 是sass的一個工具庫compass在sass 的基礎上封裝了一系列有用的模組，用來補充和豐富sass的工能，安裝：compass是用 ruby語言開發的，所以安裝它之前必須安裝ruby。命令：gem install compass項目初始化：要建立一個你的Compass 項目，如果項目的名字叫 myproject compass create myproject會在當前的目錄下產生這個目錄，裡面有config.rb檔案，還有兩個子目錄sass 和 stylesheets

css樣式如下：#div1{　　width:200px;　　height:400px;　　background:red;　　overflow:auto;}#div1::-webkit-scrollbar{　　width:5px;　　height:5px;}#div1::-webkit-scrollbar-track{　　background:hotpink; //軌道的樣式}#div1::-webkit-scrollbar-thumb{　　background:deeppink;

從sass到PostCSS 多年來我一直使用Sass.但是最近我想要使用PostCSS和它的cssnext外掛程式來嘗試處理樣式.我愛死了現在就可以使用將來的CSS特性,相對於之前我用的工具,它們更順手一些.我的個人網站就是嘗試新特性的最好的測試地.第一步是列出我Sass用法的清單.我需要知道我使用了哪些特性,並且確信新特性在postCSS中有替代品.以下是我正在這個項目中使用的特性：部分引用（partial

一般地，置中絕對位置元素，left:50%;top:50%;再margin負值或者通過transform也可達到效果。今天發現另一個技巧，利用，top,left,right,bottom取值0，再magin:auto,即可實現置中。原因：<div class='box> <div class='jz'></div></div>div.box{ position: relative; height: 300px;

一、div+css布局1.css水平垂直置中方法1:相容性最好的方法.box{ position: absolute; top: 0; right: 0; left: 0; bottom: 0; margin: auto; width: 200px; height: 200px; background-color: #eee; }方法2: css3

如何檢測css特性如果我們要檢測一個css屬性是否支援var dom = document.createElement('p');if ('textShadow' in dom.style) { alert('支援textShadow屬性')}else { alert('不支援textShadow屬性')}如果我們要檢測該css3屬性是否支援某值var dom = document.createElement('

此處僅列舉幾種個人認為易模糊不清的情形。html結構如下：<p class="parent"> <p class="child"> 測試行高 </p></p>父元素為數字，子項目未設.parent{ font-size: 12px; ine-height: 1; }.child{ font-size: 16px; }父元素parent為

我們都知道，要做WD（web designer）,首先得伺侯好幾個瀏覽器:IE6,IE7,Firefox.一般的頁面，都只要求在IE6,IE7,Firefox下正常工作就行了。但是實際上，瀏覽器遠遠不止這幾個,Firefox分為Firefox 1.5,Firefox 2,Firefox 3幾個主要版本，IE7,IE6中也各有好幾個系列,另外除開這兩個主流廠商的產品之外，還有Opera,Konqueror,Netscape,chrome等一系列。 　　這些瀏覽器，各有各的一套，往往在這裡運行正常，

今天這篇文章我們在一起來看看 CSS3 中實現漸層效果的 Gradient 屬性的具體用法。在以前，漸層效果和陰影、圓角效果一樣都是做成圖片，直接編寫 CSS 代碼就可以實現。《CSS3 經典教程系列》的前一篇文章向大家詳細介紹了 text-shadow 文本陰影特性的用法，今天這篇文章我們在一起來看看 CSS3 中實現漸層效果的 Gradient 屬性的具體用法。在以前，漸層效果和陰影、圓角效果一樣都是做成圖片，直接編寫 CSS 代碼就可以實現。CSS3 Gradient 分為

本文主要介紹了css中float的用法，以及網頁中常用的幾種布局方式。具有一定的參考價值，下面跟著小編一起來看下吧float與margin兩個相鄰的浮動元素，當第一個浮動元素（不論是左浮動還是右浮動）的寬度為100%時，第二個浮動元素會被擠到下面，通過添加負margin-right值（絕對值最少等於它自身的寬度），可以使它回到第一行。在書寫html代碼時，我們通常的習慣根據UI樣式，從左往右來寫代碼，但有時候右側的內容比較重要，所以它的html結構需要放在左側內容上面，讓它更早的載入，比如：左側

眾所周知，表單中的一寫元素原生樣式不是很好看，項目中用到的時候需要最佳化，下面這篇文章主要介紹了如何利用CSS3美化單選、複選按鈕的顯示樣式,需要的朋友可以參考借鑒，下面來一起看看吧。前言相信大家都知道在表單元素中，選項按鈕和複選按鈕都具有選中和未選中狀態。要覆寫這兩個按鈕預設樣式比較困難。在CSS3中，我們可以通過狀態選取器“:checked”配合其他標籤實現自訂樣式。利用CSS3我們可以打造非常具有個人化的使用者表單，本文中實現的效果非常不錯，感興趣的朋友們下面來一起學習學習。如下執行個體代

CSS中的-webkit-tap-highlight-color屬性，簡單來說功能就是手機端點擊時的背景色設定，下面這篇文章主要介紹了CSS3中這個鮮為人知的屬性：-webkit-tap-highlight-color的相關資料,需要的朋友可以參考借鑒，下面來一起看看吧。-webkit-tap-highlight-color這個屬性只用於iOS