Dreamweaver cs6 網頁設計教程

、新建一個站點

二、設置站點的服務器和圖片存儲路徑

1.設置圖片存儲路徑：點擊上圖的管理站點彈出下圖界面

2.設置服務器：

三.新建一個HTML文件，修改頁面屬性：

1.打開頁面屬性：

2.選擇標題編碼項，文檔類型選擇HTML5

3.配置首選參數，這樣新建的HTML文件會默認使用HTML5格式

四、代碼縮進快捷鍵：

五、HTML知識：

1.標題：標題有h1到h6幾種樣式，都是單獨一行，字體加粗變大的效果，h1最大，h6最小

示例： <h1></h1>

2.段落：

換行：

3.加粗： 語法強調

傾斜： 語法強調

下劃線： <ins></ins>語法強調

4.大號字體：<big></big>

小號字體：

水平分割線：<hr />

5.文本標記：

6.項目列表： <ul>

</ul>

7.編號列表：<ol> 自動排序

</ol>

8.列表項： <dl>

<dt></dt> 分組，dt和dd是并列關系

</dl>

9.使用表格：<tabel width="600" height="600" border="1"> 表格的寬和高，邊框

<caption></caption>表格的標題

<tr> 表格的行

<td></td> 表格的列

</tr>

</tabel>

10.定義書簽：<a href="#dibu"></a> 創建鏈接，跳轉到頁面底部

<a name="dibu"></a> 在代碼底部創建鏈接

11.播放音頻：<embed src="" width="0" height="0"></embed>

六、CSS樣式表：

1.鏈接CSS文件：<link rel="stylesheet" href="" /> stylesheet是樣式表的意思

tml5網站是目前非常流行，用html5技術開發的網站能實現跨平臺運行，它可以輕易地接入手機瀏覽器、微信甚至是APP應用，靈活性非常大。目前企業建站對html5技術的需求很大，今天給大家講講哪些工具可以開發html5網站。

Dreamweaver

簡稱“DW”，程序員常說的“織夢”，利用它可以輕而易舉地制作出充滿動感的網頁。對初級人員，可以不用寫代碼就能快速創建web頁面，對高級人員，也有對應的成熟代碼編輯工具，創作靈活性高。

Adobe Edge

Adobe Edge的目的是幫助專業設計師制作網頁動畫乃至簡單游戲。該工具的重點放在動畫引擎上，最大的特點就是界面友好，能替開發者省下好多編HTML和CSS的時間，也就少了代碼錯誤的可能性。對新手來說，沒有編程基礎的研究一下也可以用。但缺點是Adobe Edge做出來的網站有很多冗余代碼，比較適合單純性制作動畫。

WebStorm

WebStorm 為前端而生，專門為 JS 開發做了很多優化，被廣大中國JS開發者譽為“Web前端開發神器”、“最強大的HTML5編輯器”、“最智能的JavaScript IDE”等。這款軟件的定制功能很強大，版本更新比較快。缺點是比較占用電腦內存。

DevExtreme

專門針對Visual Studio開發者提供的一款跨平臺HTML5/JS移動應用開發框架，這個框架可以幫助你直接在Microsoft Visual Studio集成開發環境，構建iOS，Android和Windows Phone 8應用程序。DevExtreme包含 PhoneJS 和 ChartJS 兩個原生組件，并且提供源代碼。

Html5的開發工具還有很多，對開發者來說，以上幾款工具組合應用能有很好的效果。對零基礎的開發者來說，以上幾段無異于看天書。其實，要開發html5網站還可以借助目前的自助建站工具，性價比較高的有建站寶盒。上千套html5網站模板，直接安裝就能做網站，不涉及程序開發，完全拖拽式操作，選中模塊直接添加動畫效果，做出來的網站還是響應式的，大大縮短了html5網站的開發周期。

目前，一套建站寶盒展示型網站解決方案的價格才870元/年，有需要的開發html5網站的站長可以試一下，比花時間研究這些很難一下看懂的開發工具簡單多了。

零基礎建html5網站：http://www.iisp.com/design/?s=yuqiuping

茅臺集網頁設計要是用HTML DIV+CSS JS等來完成頁面的排版設計。

網頁有搜素框導航欄 js圖片輪播；

網頁由網站首頁，公司簡介，公司發展歷程，最新新聞動態組成；

具體效果圖展示：

在線咨詢

上一篇：sublime安裝和簡化
下一篇：一篇文章帶你了解CSS3圓角知識

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

Dreamweaver cs6 網頁設計教程

您的項目需求