自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

DIV適用場合及其他常用布局標(biāo)簽

開發(fā) 前端
本文向大家介紹一下DIV的應(yīng)用場合,雖然在這方面沒有什么硬性的規(guī)定,但個人認(rèn)為DIV更適用于大體框架的定位,希望本文介紹對你有所幫助。

在學(xué)習(xí)網(wǎng)頁布局的過程中,你可能會遇到DIV的使用問題,這里和大家分享一下DIV的適用場合,相信本文介紹一定會讓你有所收獲。

什么時候應(yīng)該用DIV?

  雖然在這方面沒有什么硬性的規(guī)定,但個人認(rèn)為DIV更適用于大體框架的定位。例如我們要定義一塊頭部的區(qū)域,一般會這樣定義一個DIV:

  這里就是頭部框架里要寫的內(nèi)容

  當(dāng)然,可以用class來定義,但一般來講如不是在同一頁面會重復(fù)的元素,用id能更好的區(qū)別開來.

  查看如下定義代碼
  

  1. <ulidulid="navbar"> 
  2.   <liidliid="articles"> 
  3.   Articles</li> 
  4.   <liidliid="topics"> 
  5.   Topics</li> 
  6.   <liidliid="about"> 
  7.   About</li> 
  8.   <liidliid="contact"> 
  9.   Contact</li> 
  10.   <liidliid="contribute"> 
  11.   Contribute</li> 
  12.   <liidliid="feed"> 
  13.   Feed</li> 
  14.   </ul> 
  15.   <h1idh1id="masthead"> 
  16.   <ahrefahref="/"> 
  17.   <imgsrcimgsrc="/pix/alalogo.gif"alt="ALISTApart:ForPeopleWhoMakeWebsites"/> 
  18.   </h1> 

  No.214
  定義了最上面的導(dǎo)航(ul部分),左邊的大logo和那個圓圓的No.xxxx的標(biāo)記.
  他沒有使用DIV來做頂部的框架,但卻很好的說明了這些代碼的用途,為什么?因為他活用了HTML提供的標(biāo)簽,以及樣式名稱的定義
  
其它最常用的布局標(biāo)簽

  h1
  這個標(biāo)簽或許真正會去用的人很少,因為它顯示的字體真的是太"大"了,但我們是CSSer,有什么標(biāo)簽樣式不能改呢?而且它所能表達(dá)的意思就如同它原先的作用一樣明顯(大標(biāo)題)我想你已經(jīng)知道怎么去用它了^_^

  ul
  這個標(biāo)簽很多情況是用來定義導(dǎo)航部分的,當(dāng)然也可以用ol來代替,但導(dǎo)航連接沒有什么順序之分吧,所以還是用ul來的比較確切(去掉CSS后效果更明顯)

  b
  這個已經(jīng)不再推薦使用的標(biāo)簽,在布局上卻能帶來不少的方便(因為短),雖然我不是太贊成使用這個標(biāo)簽,但有些時候(比如細(xì)小地方的布局定義)還是不錯的選擇

  h2
  h2使用最多的地方應(yīng)該不是布局上,而是副標(biāo)題,但有些地方需要定義欄目樣式的話,用這個標(biāo)簽比較合適,欄目內(nèi)容就使用p
 

【編輯推薦】

  1. DIV+CSS網(wǎng)頁重構(gòu)概念詳解
  2. 解析DIV絕對定位和相對定位
  3. 深入剖析DIV概念和用法
  4. Div+CSS布局入門之寫入整體層結(jié)構(gòu)與CSS
  5. DIV+CSS開發(fā)過程中影響SEO的制作細(xì)節(jié)

 

 

責(zé)任編輯:佚名 來源: hi.baidu.com
相關(guān)推薦

2010-06-13 16:53:15

UML類

2010-06-07 13:51:59

Hadoop簡介

2017-12-07 14:40:05

前端FlexCSS

2010-09-09 16:36:36

DIV標(biāo)簽

2010-08-24 10:11:26

DIV標(biāo)簽

2022-03-09 18:09:47

前端CSS代碼

2010-08-27 13:46:58

DIV+CSS

2010-08-24 09:52:55

DIV標(biāo)簽

2019-05-20 10:38:42

UDP協(xié)議場合

2009-06-17 14:13:10

Eclipse常用技巧

2010-08-24 10:01:05

DIV

2011-05-05 09:45:34

云計算試點城市

2010-08-19 13:43:07

marginpadding

2010-08-27 10:59:11

DIVTable

2010-08-27 08:53:18

CSS類id命名DIV

2020-07-20 14:00:26

架構(gòu)運維技術(shù)

2023-11-29 07:43:30

2010-09-14 08:53:06

DIVTable

2010-08-24 11:00:55

DIV CSS

2010-08-16 12:54:53

DIVCSS
點贊
收藏

51CTO技術(shù)棧公眾號