分類彙整: CSS 教學 – 網頁排版

CSS 教學 – margin-top 失效!外間距會直接影響到上一層

調整內容的上間距 調整文字元素或圖片元素的上間距,理所當然是要使用 margin-top 語法,然而,當我們高高興興完成網頁排版,心想趕快收拾包包下班走人時,慘劇往往就發生在各個瀏覽器的不一致問題之中… 閱讀全文

in CSS 教學 - 網頁排版

CSS 排版教學 – float 浮動排列 – 表格做不到的功能

float 浮動排列~ 是 CSS 排版時很常用到的語法,也是表格做不到的功能之一….. 尤其是對於學習過 PHP 或 ASP 資料庫的同學來說,想要做出電子相本或購物網站的頁面編排時… 閱讀全文

in CSS 教學 - 網頁排版

CSS 教學 – 文字大小、間距、行距、背景圖

大部份 CSS 語法的教學書籍第一課,就是練習使用 CSS 語法來調整文字大小、間距、行距 … 我們這個範例也是,最基本的入門練習… 閱讀全文

in CSS 教學 - 網頁排版

CSS 排版教學 – 設計圖形按鈕選單 – 入門篇【二】

接續上一篇 CSS 語法 – 設計圖形按鈕選單 – 入門篇【一】 再讓同學練習一次 同樣的 <ul> <li> 項目清單結構,同樣的 CSS 基本語法,就可以做出不同的變化與創意。 設計圖形按鈕選單,在 HTML 結構… 閱讀全文

in CSS 教學 - 網頁排版

CSS 排版教學 – 設計圖形按鈕選單 – 入門篇【一】

設計圖形按鈕選單,在 HTML 的內容結構上,大部份都會使用 <ul> <li> 項目清單,在結構上非常的簡潔,在編排上可以非常的靈活。因此,不只是 設計按鈕選單,有很多的 CSS 網頁排版技巧,也是一致十分愛用… 閱讀全文

in CSS 教學 - 網頁排版

CSS 教學 – 為標題文字設定背景圖片

CSS 語法最重要的功能就是 display:block; 框格模型(區塊模式),框格可以製定寬度高度,可以調整位置,可以置入圖片… 等。 所謂的 CSS 網頁排版技巧,有一大半就是利用 display:block; 這個方法來完成的… 閱讀全文

in CSS 教學 - 網頁排版