Get me outta here!

網頁教學:<div>標記與<span>標記之介紹

 

在進行網頁設計時,常會需要將版面中之各種文字、圖片或表格等元件進行對齊,之前很多人係利用建立表格之方式來進行排版。其實除了利用表格來進行對齊外,<div>及<span>標記亦有相同的功能。,<div>及<span>標記之介紹及使用方式說明如下:

一、<div>標記之介紹

      <div>標記是動態網頁中重要的標記,它具有群組及圖層的功能,如果再搭配javascript語法或CSS語法,就能讓網頁中之相關組成元件產生移動,甚至能控制元件的顯示與隱藏。

      <div>標記係屬於圍堵標記,就是說必須有起始標記(<div>)及結束標記(</div>)。此外,</div>標記後,網頁內容會呈現自動換行之情形,也就是說<div>標記屬於獨立的區塊標記(block-level),它不會與網頁中之其它元件同時顯示在同一行。<div>標記之功能其實有點類似群組,只要放在<div>標記與</div>標記裡的內容(如文字、圖片),皆會被視為同一物件,因為<div>標記有此特性,所以網頁設計時,常被用作對齊之功能。

1. <div>標記之輸入語法

2. <div>標記之屬性介紹