什么是DIV + CSS?
在很久很久以前,web工程師通過(guò)table進(jìn)行頁(yè)面布局(現(xiàn)在Google的picasa等應(yīng)用還能找到table布局應(yīng)用的例子),現(xiàn)在頁(yè)面布局大都推薦div+css方式。 所謂的div+css是指通過(guò)css控制div的布局。其實(shí)這兒div可以理解為統(tǒng)稱,實(shí)際應(yīng)用的不僅是div,還有p,span,img,table等任意節(jié)點(diǎn)的定位都可以通過(guò)css來(lái)控制。
方法/步驟
-
簡(jiǎn)要對(duì)比一下: 1、div+css相對(duì)于table更為靈活,用table布局,代碼臃腫。 2、語(yǔ)義性問(wèn)題。從語(yǔ)義上來(lái)說(shuō),table應(yīng)該只是表格數(shù)據(jù)的容器,不應(yīng)該是布局的工具。 3、樣式渲染問(wèn)題。table布局要等內(nèi)容全部加載完畢后才渲染樣式,如果用戶網(wǎng)速不好,這樣用戶體驗(yàn)會(huì)很差。
-
在WEB前端開(kāi)發(fā)中,HTML,CSS,JS這三家三駕馬車(chē)分別代表著結(jié)構(gòu),展示,和交互。 在web1.0的時(shí)代,頁(yè)面的邏輯并不是特別復(fù)雜,對(duì)用戶體驗(yàn)的要求也不是很高,table被大量開(kāi)發(fā)者用來(lái)做布局元素,橫跨結(jié)構(gòu)和展示兩個(gè)部分,是很“重”的。但是在如今web前端邏輯越…顯示全部
在WEB前端開(kāi)發(fā)中,HTML,CSS,JS這三家三駕馬車(chē)分別代表著結(jié)構(gòu),展示,和交互。
-
在web1.0的時(shí)代,頁(yè)面的邏輯并不是特別復(fù)雜,對(duì)用戶體驗(yàn)的要求也不是很高,table被大量開(kāi)發(fā)者用來(lái)做布局元素,橫跨結(jié)構(gòu)和展示兩個(gè)部分,是很“重”的。
但是在如今web前端邏輯越來(lái)越復(fù)雜,用戶體驗(yàn)要求越來(lái)越高的情況下,對(duì)這三者的解耦是必須的。此時(shí)再用table拿來(lái)做布局就不太合適了,因?yàn)閠able標(biāo)簽的語(yǔ)言根本不是用來(lái)做布局的,而是用來(lái)傳遞數(shù)據(jù)的。而div+css是符合解耦這一思想的,div用來(lái)控制布局,css用來(lái)控制樣式。好處從小了說(shuō)是整個(gè)頁(yè)面的代碼組織結(jié)構(gòu)更合理,耦合度更低,從大了說(shuō)是更利于前端開(kāi)發(fā)的深度分工和復(fù)雜合作。
-
DIV+CSS如其字面意思,就是網(wǎng)頁(yè)HTML代碼主要使用DIV將內(nèi)容模塊化,用CSS控制其顯示效果。 好處很多,從前端層面來(lái)說(shuō),大大減輕工作量,提高工作效率。 從界面布局來(lái)將,能夠更準(zhǔn)確的將頁(yè)面元素定位,且保證在不同的環(huán)境下獲得基本一致的效果。 還有比如你說(shuō)…顯示全部
-
DIV+CSS如其字面意思,就是網(wǎng)頁(yè)HTML代碼主要使用DIV將內(nèi)容模塊化,用CSS控制其顯示效果。好處很多,從前端層面來(lái)說(shuō),大大減輕工作量,提高工作效率。從界面布局來(lái)將,能夠更準(zhǔn)確的將頁(yè)面元素定位,且保證在不同的環(huán)境下獲得基本一致的效果。
-
前端的制作常常會(huì)涉及到一個(gè)問(wèn)題,就是定位布局。 按照頁(yè)面設(shè)計(jì)圖來(lái)進(jìn)行定位的話,在以往是用TABLE的方式,也就是將整個(gè)頁(yè)面當(dāng)做一張大表格,然后哪個(gè)地方需要放置什么元素就在表格里放置那個(gè)元素。 CSS 是層疊式樣式表,是對(duì)HTML元素比如p,h1,還有div之類(lèi)…顯示全部
-
前端的制作常常會(huì)涉及到一個(gè)問(wèn)題,就是定位布局。 按照頁(yè)面設(shè)計(jì)圖來(lái)進(jìn)行定位的話,在以往是用TABLE的方式,也就是將整個(gè)頁(yè)面當(dāng)做一張大表格,然后哪個(gè)地方需要放置什么元素就在表格里放置那個(gè)元素。
上一篇:沒(méi)有了
-
06/062018
alexa排名是什么?【廣州網(wǎng)站建設(shè)】
什么是alexa排名?