Showing posts with the label CSS樣式Show all
CSS粗體：CSS 加粗知識與CSS 加粗實例

CSS粗體：CSS 加粗知識與CSS 加粗實例

Kevin Li
by Kevin Li 5:22 PM

比較好的網頁文字從前大家在 HTML 會用標籤 b 或 strong 來達到粗體文字的效果，但在 CSS 的語法中，必須採用 CSS 專用的語法：font-weight，之…

CSS clear 用法介紹

CSS clear 用法介紹

Kevin Li
by Kevin Li 9:35 AM

clear 是用來清除某一元素的側邊浮動元素，假設兩個 div 區塊使用了浮動（ CSS float ）而併排在一起，如果要讓這兩個元素不要併排在一起，則可以使用 clea…

CSS float 浮動元素

CSS float 浮動元素

Kevin Li
by Kevin Li 9:34 AM

CSS float 用來定義區塊的浮動，可以設定為靠左浮動或靠右浮動，常見用法像是文字繞圖片的特效或是  DIV  區塊排版上使用，在 CSS 設計上任何元素都是可以浮動的…

DIV 隱藏技巧

Kevin Li
by Kevin Li 9:32 AM

在某些時候會需要隱藏 DIV 區塊，例如網頁剛開啟的時候不顯示，當網友使用了某些選項再開啟 DIV 區塊之類的應用，而 DIV 隱藏有兩種常見的技巧，分別是  JavaSc…

CSS DIV 寬度與高度的設定

Kevin Li
by Kevin Li 9:32 AM

DIV 是區塊的意思，既然是區塊，當然可以設定他的寬度與高度，要設定 DIV 寬度可以使用 width 來給值，另外也可以搭配 height 來設定高度，幾乎所有主流的瀏覽…

CSS display block 屬性與用法

Kevin Li
by Kevin Li 9:31 AM

CSS display block 規定元素以區塊方式呈現，相較於  display inline  的同一行呈現恰恰相反，當一個元素如多張圖片或多段文字的屬性設定為區塊（…

CSS display inline 屬性與用法

Kevin Li
by Kevin Li 9:30 AM

CSS display inline 的屬性是用來定義元素在同一行呈現，也就是圖片或文字均不換行的意思，相對應的用法為  display block ，我們將在另一篇做詳細…

CSS overflow 屬性用法

CSS overflow 屬性用法

Kevin Li
by Kevin Li 9:29 AM

CSS overflow 屬性用來定義元素超過某個範圍的時候該如何呈現，例如圖片超過預設區域的大小、文字長度超出原本的範圍等，這時候你可以透過 CSS overflow 屬…

CSS position 位置屬性（定位）

Kevin Li
by Kevin Li 9:27 AM

CSS position 位置屬性是用來設定元素位置的語法，你可以定義出某個元素（如圖片、 DIV  區塊、h1、h2 ... 等）要在網頁的哪個位置呈現，例如將一個圖片設…

CSS 文字垂直置中技巧

Kevin Li
by Kevin Li 9:26 AM

會寫這一篇是因為在 CSS 中要水平置中相當簡單，只要使用  text-align  即可，但是垂直置中就不是這麼容易的事情，其實說難也不難，只要用一點小技巧就可以做出文字…

CSS text-align 水平對齊

Kevin Li
by Kevin Li 9:25 AM

CSS text-align 的用途是水平對齊，可以設定靠左、靠右、置中甚至是使左右對齊本文等特性，要注意的是 text-align 只能設定水平對齊，無法設定垂直方向的對…

CSS DIV 置中

CSS DIV 置中

Kevin Li
by Kevin Li 3:50 AM

如果你習慣採用  DIV  來做網頁的排版，那就難免會碰到需要讓 DIV 置中的時候，在大部分主流的瀏覽器中，想要要讓 DIV 置中，僅需要用到  margin  就能夠達…

CSS 置底技巧，可用於 Footer 區塊

CSS 置底技巧，可用於 Footer 區塊

Kevin Li
by Kevin Li 3:49 AM

網頁設計整體而言會先規劃出頁面的呈現方式，普遍的規劃可能像下方圖片這樣，從最上方的 Site Name 開始，左邊有 Sidebar 區塊（通常是一些網頁的選單 Menu）…

CSS letter-spacing 文字間的字距

Kevin Li
by Kevin Li 3:49 AM

CSS letter-spacing 屬性的功能可以用來設定文字水平方向間的空白區間，letter-spacing 的屬性值可以為正值或負值，當 letter-spacin…

分享幾個 css template 樣板網站

Kevin Li
by Kevin Li 3:47 AM

話說我們在設計 CSS 的時候，總不能老是自己天馬行空的想版型，有時候也可以參考別的高手設計出來的作品，一方面多看多增加設計的想法，另一方面也可以修改自己設計上的缺點，而網…

CSS 註解的寫法

Kevin Li
by Kevin Li 2:58 AM

大部分的程式語言都有註解的功能，為的當然是在程式中寫下每個段落的意思，未來維護起來可以比較容易，在  CSS  中也不例外，而 CSS  的註解寫法有分為單行註解與多行註解…

CSS span 標籤用法介紹

Kevin Li
by Kevin Li 2:56 AM

span 標籤在  HTML  設計的時候就已經廣泛在使用，同樣的到了  CSS  設計也可以繼續使用，span 標籤可以用來標示一個行元素，與  DIV  區塊的用法有點…

CSS DIV 區塊標籤的使用教學

Kevin Li
by Kevin Li 8:55 PM

傳統在  HTML  上排板都是採用表格（ table ）的方式，但是用表格排板會衍伸出許多的缺點，例如表格的架構必須等整個 table 完整下載後，才能順利呈現，如果表格…

CSS樣式：CSS padding 內距屬性與用法範例

Kevin Li
by Kevin Li 2:03 AM

透過 CSS padding 內距的設定，可以控制區域如  DIV  或  span  的內部距離，也可以控制 HTML 的表格內部距離（例如文字或圖片與邊框的距離），pa…

CSS樣式：CSS margin 屬性與用法範例

Kevin Li
by Kevin Li 2:01 AM

CSS margin 屬性用來定義一個區域（例如  DIV  或  span ）的外邊界距離，俗稱外距，與常用的  padding （內距）剛好不同。margin 可以讓你…