楊曉姍
摘?要:布局對網頁的作用類似于設計圖對地產開發商的作用,制作商務網頁的首要內容是對網頁進行布局。常見的布局方式有:表格布局、框架布局、層布局,鑒于以上布局方式均存在一定的缺陷逐漸退出歷史潮流。目前流行的布局方式是DIV+CSS來制作頁面,DIV主要解決網頁中的元素(如文字、圖片、表格、音視頻等)放置在網頁顯示位置的問題,而CSS主要解決網頁元素美觀性的問題。本文主要探討DIV+CSS布局方式用法及要注意的問題。
關鍵詞:DIV+CSS;浮動布局;定位布局
一個商務網頁是否吸引用戶,布局至關重要。所謂布局就是對網頁元素進行定位,網頁整體結構是上中下還是左中右,網頁的LOGO、導航、網頁標題、網頁核心內容、版權信息等內容顯示的位置。鑒于表格布局導致表格標簽的嵌套瀏覽器解析較慢,框架布局不夠靈活,DIV+CSS布局方式逐漸成為主流,DIV實現把頁面進行切割,不同的DIV放置不同的內容,CSS實現對內容進行美化,如添加背景色、設置不同塊之間的間距等等。
1 DIV+CSS的概念
DIV是HTML語言中的一個標簽元素即
,該標簽代表一個容器本身沒有實際意義,是一個塊級元素,在該標簽中可以放置文字、圖片、鏈接、音樂、div等,一個頁面可以通過多個div標簽的嵌套實現對網頁進行分割,通過設置div中的內容與div的內邊距、不同div之間的外邊距來對頁面進行布局。CSS(Cascading Style Sheets)指層疊樣式表,作用是對網頁元素進行美化,CSS可以出現在HTML標簽行中、HTML的
標簽中、外部樣式表三個位置,在DIV+CSS布局中常常把CSS獨立形成一個.css文件,實現與HTML文件完全分離,可以實現樣式表的重復使用、網頁的結構與表現可以實現完全分離。……