天津博奧教育首頁>天津博奧教育培訓(xùn)課程學(xué)習(xí)輔助資料>網(wǎng)頁設(shè)計(jì)培訓(xùn)就業(yè)輔導(dǎo)學(xué)習(xí)資料> div+css網(wǎng)頁布局標(biāo)準(zhǔn)教程
注重實(shí)戰(zhàn)經(jīng)驗(yàn)傳授，打造視覺設(shè)計(jì)精英
視覺設(shè)計(jì)培訓(xùn)天津博奧教育全新五合一教學(xué)模式線上下同時(shí)授課
1.十多年教學(xué)經(jīng)驗(yàn)，由視覺設(shè)計(jì)行業(yè)專家授課
2.視覺設(shè)計(jì)采用WORKSHOP授課方式，更好吸收教學(xué)內(nèi)容
3.有問題可以隨時(shí)提出，不積壓?jiǎn)栴}及時(shí)解決問題
4.視覺設(shè)計(jì)培訓(xùn)學(xué)習(xí)期滿后可推薦就業(yè)
5.在工作中遇到技術(shù)或者設(shè)計(jì)上的問題給予免費(fèi)指導(dǎo)
6.視覺設(shè)計(jì)培訓(xùn)課程可免費(fèi)重修
天津平面設(shè)計(jì)培訓(xùn)分類
天津平面設(shè)計(jì)培訓(xùn)就業(yè)實(shí)操課程不單專業(yè)講解PS_AI_CDR_ID平面設(shè)計(jì)軟件的使用方法及設(shè)計(jì)的實(shí)用技巧,并要讓學(xué)生認(rèn)識(shí)設(shè)計(jì)軟件的基本工作原理和將創(chuàng)意設(shè)計(jì)呈現(xiàn)的方法,利用平面廣告設(shè)計(jì)經(jīng)典案例讓學(xué)生把握在商業(yè)性平面廣告設(shè)計(jì)有關(guān)的領(lǐng)域中的應(yīng)用特性、制作方法步驟、拓展學(xué)生的平面廣告設(shè)計(jì)構(gòu)思,提升學(xué)生的現(xiàn)實(shí)實(shí)踐經(jīng)驗(yàn),提升自主的設(shè)計(jì)的工作能力,在培訓(xùn)中注入較多的項(xiàng)目拓展成功案例和印刷前制作方法步驟及實(shí)用技巧和印刷后工藝,使其更深層次的達(dá)到工作實(shí)操的要求，并擁有自主進(jìn)行各類平面廣告設(shè)計(jì)項(xiàng)目的工作能力,學(xué)好后可任職平面媒體、廣告創(chuàng)意設(shè)計(jì)師、美術(shù)編輯、印前工程師、數(shù)碼打印高工、圖像合成與制作師、網(wǎng)站美工等
室內(nèi)設(shè)計(jì)培訓(xùn)高端培訓(xùn)班9月余2人
室內(nèi)設(shè)計(jì)培訓(xùn)效果圖培訓(xùn)班9月余2人
CAD培訓(xùn)室內(nèi)設(shè)計(jì)CAD制圖培訓(xùn)班9月余2人
su培訓(xùn)三維家具設(shè)計(jì)培訓(xùn)班9月余4人
天津辦公軟件培訓(xùn)Word、Excel、PPT培訓(xùn)班9月余2人
SolidWorks培訓(xùn)班9月余2人
-
室內(nèi)設(shè)計(jì)中的16條注意小小的事項(xiàng)_學(xué)室內(nèi)設(shè)計(jì)懂裝修常識(shí)
-
累人累機(jī)器的室內(nèi)設(shè)計(jì)效果圖的Vray渲染流程第二篇，切記秘籍勿忘2023年25條室內(nèi)設(shè)計(jì)裝修小知識(shí)經(jīng)典珍藏讓生活便利的室內(nèi)設(shè)計(jì)知識(shí)累人累機(jī)器的室內(nèi)設(shè)計(jì)效果圖的Vray渲染流程第一篇，切記秘籍勿忘輕裝修，重裝飾室內(nèi)設(shè)計(jì)中珠簾風(fēng)潮卷土重來_學(xué)室內(nèi)設(shè)計(jì)懂裝修工藝“我我我”急不可耐推銷是室內(nèi)設(shè)計(jì)談單的秘籍資深室內(nèi)設(shè)計(jì)師從不講的臥室設(shè)計(jì)空間擺放的要點(diǎn)寬敞舒適是現(xiàn)代室內(nèi)設(shè)計(jì)臥室的風(fēng)格把小臥室設(shè)計(jì)的寬敞要注意什么小空間大設(shè)計(jì)讓室內(nèi)設(shè)計(jì)中的小臥室寬敞_天津博奧教育室內(nèi)設(shè)計(jì)培訓(xùn)高端課程
培訓(xùn)咨詢電話：
022-58697923
022-58697932
18222233399
天津平面設(shè)計(jì)培訓(xùn)視覺設(shè)計(jì)培訓(xùn)精品設(shè)計(jì)培訓(xùn)課程推薦
天津平面設(shè)計(jì)培訓(xùn)就業(yè)實(shí)戰(zhàn)班
高端天津平面設(shè)計(jì)培訓(xùn)課程
UI設(shè)計(jì)師培訓(xùn)一對(duì)一
天津平面設(shè)計(jì)軟件培訓(xùn)
天津平面設(shè)計(jì)C4D培訓(xùn)
div+css網(wǎng)頁布局標(biāo)準(zhǔn)教程_天津平面設(shè)計(jì)培訓(xùn)_室內(nèi)設(shè)計(jì)培訓(xùn)_網(wǎng)頁設(shè)計(jì)培訓(xùn)學(xué)習(xí)輔助資料
本文章摘自十多年天津平面設(shè)計(jì)培訓(xùn)教學(xué)經(jīng)驗(yàn)的天津博奧教育官網(wǎng)psnx.com.cn
天津博奧教育培訓(xùn)為學(xué)生提供最專業(yè)的網(wǎng)頁設(shè)計(jì)培訓(xùn)，今天就從建站的流程為學(xué)員講解div+css布局標(biāo)準(zhǔn)教程：建立站點(diǎn)、結(jié)構(gòu)分析、搭建框架、切割效果圖、布局頁面—頭部和導(dǎo)航、布局頁面—側(cè)邊欄、布局頁面—主體部分‘’底部和細(xì)節(jié)調(diào)整、相對(duì)路徑和相對(duì)于根目錄路徑。
一、建立站點(diǎn)：要做一個(gè)網(wǎng)站，首先需要建立一個(gè)站點(diǎn)。那么什么是站點(diǎn)，為什么要建立一個(gè)站點(diǎn)呢？因?yàn)檎静煌谄渌募�，比如一個(gè)圖片，放到哪個(gè)盤哪個(gè)目錄下都可以訪問。而網(wǎng)站是許多文件相互關(guān)聯(lián)的，所以要專門一個(gè)目錄把它們分門別類存放起來。如果搞過視頻編輯的朋友都知道，需要先建立一個(gè)工程，把原始的視頻文件、圖片素材分類放好，也是這個(gè)道理。下面以在D盤建立一個(gè)jiaocheng文夾為例，在dreamweaver(簡(jiǎn)稱DW)里創(chuàng)建一個(gè)站點(diǎn)指向這個(gè)文件夾，然后在目錄下新建images文件夾、css文件夾等把各類文件分別存放起來。保存后，一個(gè)站點(diǎn)就建立起來了，我用的是DW cs5版本不同版本界面有所不同。如果要連FTP，需要設(shè)置服務(wù)器選項(xiàng)（后面會(huì)涉及到）。站點(diǎn)建立好后，我們先建立一個(gè)images和css文件夾分別用來存放圖片和css文件。直接在windows的資源管理器下建立或者在dw里建立都是可以的；dw立需要在文件面板列表的根目錄上點(diǎn)擊右鍵，選擇新建文件夾后更改名字即可。
二、結(jié)構(gòu)分析：創(chuàng)建完站點(diǎn)后，就需要對(duì)頁面結(jié)構(gòu)進(jìn)行分析了，根據(jù)效果圖，分析頁面分為幾大塊，該怎么布局更合理。
在瀏覽器中打開效果圖預(yù)覽：整個(gè)頁面分為頭部區(qū)域、導(dǎo)航區(qū)域、主體部分和底部，其中主體部分又分為左右兩列，整個(gè)頁面居中顯示，看明白了這點(diǎn)，下邊的框架就好搭建了。
三、搭建框架：首先在dw里新建一個(gè)html文件：點(diǎn)擊創(chuàng)建后會(huì)自動(dòng)生成如下代碼的一個(gè)html文件，保存為index.html并把無標(biāo)題文檔改為：主頁。強(qiáng)調(diào)一點(diǎn)，許多同學(xué)喜歡把第一行代碼刪除掉，認(rèn)為沒用，其實(shí)這句話的作用大著呢，它標(biāo)明以何種形式解析文檔，如果刪除可能會(huì)引起樣式表失效或其它意想不到的問題。接下來需要插入以上各個(gè)塊的標(biāo)簽了，以插入header的標(biāo)簽 為例，其它的插入方法類同。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
l1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>主頁</title>
</head>
<body>
</body>
</html>
按照上圖的方法依次插入標(biāo)簽，或者直接在代碼視圖中手工輸入，代碼如下：（注意main和side在maincon tent里包含著呢）
下一篇：在平面設(shè)計(jì)中什么時(shí)候要用四色又什么時(shí)候要用到專色印刷它們區(qū)別何在
熱文：如何把平衡感這條重要的視覺法則靈活應(yīng)用到平面設(shè)計(jì)中
相關(guān)培訓(xùn)：天津市天津平面設(shè)計(jì)培訓(xùn)、天津市天津平面設(shè)計(jì)培訓(xùn)就業(yè)班、天津UI設(shè)計(jì)培訓(xùn)、天津PS培訓(xùn)、天津C4D培訓(xùn)、天津AI培訓(xùn)、天津犀牛Rhino培訓(xùn)、 天津Solidworks培訓(xùn)、SolidWorks培訓(xùn)全科班、天津素描培訓(xùn)、天津CAD培訓(xùn)、天津室內(nèi)設(shè)計(jì)培訓(xùn)、天津建筑Rhino參數(shù)化設(shè)計(jì)培訓(xùn)、天津辦公軟件培訓(xùn)、天津各所大學(xué)到天津博奧教育的乘車路線
PS設(shè)計(jì)軟件培訓(xùn)課程學(xué)習(xí)輔導(dǎo)資料
為了更好的讓學(xué)員進(jìn)行學(xué)習(xí)PS設(shè)計(jì)軟件，天津博奧教育在專注天津平面設(shè)計(jì)培訓(xùn)課程的同時(shí)也為學(xué)員提供大量的PS軟件的學(xué)習(xí)輔導(dǎo)資料...
AI設(shè)計(jì)軟件培訓(xùn)課程學(xué)習(xí)輔導(dǎo)資料
學(xué)習(xí)平面設(shè)計(jì)中的AI軟件，想知道AI有多少應(yīng)用巧計(jì)，想更快的掌握AI軟件，想盡快學(xué)習(xí)并掌握AI軟件嗎？天津博奧教育提供大量...
CorelDRAW軟件培訓(xùn)學(xué)習(xí)輔導(dǎo)資料
天津平面設(shè)計(jì)培訓(xùn)課程中的CDR軟件是平面設(shè)計(jì)工作中重要的軟件之一，CDR軟件在使用中有好多實(shí)際技巧和經(jīng)驗(yàn)，為了正好的學(xué)習(xí)，天津博奧教育...
ID設(shè)計(jì)軟件培訓(xùn)課程學(xué)習(xí)輔導(dǎo)資料
為了更好的讓學(xué)員進(jìn)行學(xué)習(xí)ID設(shè)計(jì)軟件，天津博奧教育在專注天津平面設(shè)計(jì)培訓(xùn)課程的同時(shí)也為學(xué)員提供大量的id軟件的學(xué)習(xí)輔導(dǎo)資料...
天津平面設(shè)計(jì)培訓(xùn)文字設(shè)計(jì)學(xué)習(xí)輔導(dǎo)資料
文字在平面設(shè)計(jì)中的使用及表現(xiàn)，在實(shí)際工作中是非常重要，同樣也是天津平面設(shè)計(jì)培訓(xùn)課程中的重點(diǎn)，不但在課上講解，還提供大量...
天津平面設(shè)計(jì)培訓(xùn)綜合應(yīng)用案例輔導(dǎo)資料
不但注重單個(gè)設(shè)計(jì)軟件的使用和技巧，更注重的是設(shè)計(jì)軟件的綜合應(yīng)用，用實(shí)際設(shè)計(jì)案例把設(shè)計(jì)軟件無縫銜接，課上授課下課技術(shù)指導(dǎo)，還提供大量...
天津博奧教育地址：天津市南開區(qū)鞍山西道百腦匯科技大廈23樓2307室。
培訓(xùn)咨詢電話：022-58697923，022-58697932，18222233399。
天津博奧教育網(wǎng)址：psnx.com.cn
乘車路線：45、50、609、662、678、661、829、851、867、879（臥龍里站下）
640、687、859、705、829、849、847（世通大廈站下）
