css選擇器使用大於符號

子選擇器(選擇器之間使用大於符號):選擇父元素的子元素,不包括子元素的子元素

css選擇器使用大於符號可以選擇不含元素內的其他相同子元素。這個語法簡單的使用符號 大於在選擇器之間 [ > ]

以下範例可以看出在.div1 > p ,div1裡面的子元素div1-p2不受父元素引響,一樣是原來的黑色文字。若沒有使用[>]符號則連同子元素內的所有p,都會受樣式影響呈現紅色文字。

 <style type="text/css">
  .div1 > p {
  color: #F00;
  }

  .div2 p {
  color: #F00;
  }

  </style> 
  <div class="div1"><p>div1-P1</p><span><p>div1-P2</p></span></div>
  <div class="div2"><p>div2-P1</p><span><p>div2-P2</p></span></div>

Comment

IE8在css使用max-width時會有如下圖失真的情形發生。
 

<pre>標籤文字段行CSS

剛開始使用Google Code Prettify發現情況如下圖。(程式碼並沒有自動斷行)

Comment

使用50%設定top 與 left ,再用margin-top ,margin-left 減去元素的高度寬度。

如:top:50% 元素的上方對齊頁面正中央了,再用 margin-top:-100px 將元素向上移動一半 (元素高度為 200px),讓中心點對齊頁面正中央。
 

Font Awesome 的設計只需要簡單的應用Html語法,就可輕鬆在網頁加入ICON圖示。

過去網頁設計師,需要為了網頁的小圖示,需要親手設計ICON,更或者需要在網路搜尋找尋適用的ICON,總是為了這小ICON傷腦經,現在Font Awesome將提供我們,無數的ICON圖示給我們運用,而且簡單輕鬆添加在你的網頁上。

您可以將Font Awesome圖標使用在幾乎任何地方,只需要使用HTML class加入fa,空格後面再加上想要加上圖示名稱 。(圖示名稱可在Font Awesome官網搜尋到)

Comment

Copyright © 2018 ucamc