本篇文章給大家談?wù)勲娔X制作h5最常用軟件代碼，以及免費(fèi)制作h5最常用軟件對(duì)應(yīng)的知識(shí)點(diǎn)，希望對(duì)各位有所幫助，不要忘了收藏本站喔。

本文目錄一覽：

• 1、h5頁(yè)面制作工具有哪些？
• 2、制作h5的情景應(yīng)用，有哪些軟件
• 3、程序員必須知道的HTML常用代碼有哪些

h5頁(yè)面制作工具有哪些？

h5頁(yè)面制作工具有很多。

比較簡(jiǎn)單的基礎(chǔ)工具有易企秀、maka、圖怪獸等等。

比較好用的專業(yè)工具有意派Epub360、木疙瘩、IH5等等。

每個(gè)人的使用感受不一樣，你可以一個(gè)個(gè)去嘗試，然后找到最適合自己的那個(gè)就OK了。

我平時(shí)都是用意派Epub360來(lái)制作一些交互性強(qiáng)、創(chuàng)意度高的H5作品的，對(duì)這款工具比較熟悉。你剛開(kāi)始接觸的時(shí)候可以先多看看意派Epub360上的案例和模板，找找靈感，然后再對(duì)著它們的教程慢慢學(xué)。從簡(jiǎn)單的合成海報(bào)、長(zhǎng)頁(yè)面、測(cè)試題到比較有難度的一鏡到底、畫(huà)中畫(huà)、小游戲，都可以自學(xué)完成。

制作h5的情景應(yīng)用，有哪些軟件

h5就是html5，HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 標(biāo)準(zhǔn)的 HTML 標(biāo)準(zhǔn)版本，現(xiàn)在仍處于發(fā)展階段，但大部分瀏覽器已經(jīng)支持某些 HTML5 技術(shù)。HTML 5有兩大特點(diǎn)：首先，強(qiáng)化了 Web 網(wǎng)頁(yè)的表現(xiàn)性能。其次，追加了本地?cái)?shù)據(jù)庫(kù)等 Web 應(yīng)用的功能。廣義論及HTML5時(shí)，實(shí)際指的是包括HTML、CSS和JavaScript在內(nèi)的一套技術(shù)組合。它希望能夠減少瀏覽器對(duì)于需要插件的豐富性網(wǎng)絡(luò)應(yīng)用服務(wù)（plug-in-based rich internet application，RIA)，如Adobe Flash、Microsoft Silverlight，與Oracle JavaFX的需求，并且提供更多能有效增強(qiáng)網(wǎng)絡(luò)應(yīng)用的標(biāo)準(zhǔn)集

h5的制作工具有:

一、Adobe Edge

目前還處于預(yù)覽階段的Adobe Edge是用HTML5、CSS、JavaScript開(kāi)發(fā)動(dòng)態(tài)互動(dòng)內(nèi)容的設(shè)計(jì)工具。內(nèi)容可以同時(shí)兼容移動(dòng)設(shè)備和桌面電腦。Edge的一個(gè)重要功能是Web工具包界面，方便確保頁(yè)面在不同瀏覽器中的架構(gòu)一致性，此外Edge還將整合TypeKit這樣的字體服務(wù)。

動(dòng)畫(huà)和圖形可以添加到HTML元素中，程序也能通過(guò)Edge自身的代碼片段庫(kù)或者JavaScript代碼進(jìn)行擴(kuò)展。動(dòng)畫(huà)可以在獨(dú)立的時(shí)間線上進(jìn)行嵌套，還能實(shí)現(xiàn)互動(dòng)功能。符合可以服用并通過(guò)API和代碼片段控制。通過(guò)Edge設(shè)計(jì)的內(nèi)容可以兼容iOS和Android設(shè)備，也可以運(yùn)行在火狐、Chrome、Safari和IE9等主流瀏覽器。

二、Adobe Dreamweaver CS6

Adobe Dreamweaver CS6作為一個(gè)Web設(shè)計(jì)軟件，提供了對(duì)HTML網(wǎng)站和移動(dòng)程序的可視化編輯界面。其Fluid Grid排版系統(tǒng)整合CSS樣式表功能，提供自適應(yīng)版面的跨平臺(tái)兼容性。開(kāi)發(fā)者可以完全實(shí)現(xiàn)Web設(shè)計(jì)的可視化操作，無(wú)需為代碼所困。

用戶不但還能在Live View中預(yù)覽，還提供多屏幕預(yù)覽功能。開(kāi)發(fā)者可以通過(guò)MultiScreen預(yù)覽面板查看HTML5內(nèi)容的渲染效果。Live View通過(guò)WebKit渲染引擎支持HTML5。

三、Adobe ColdFusion 10

ColdFusion是用來(lái)開(kāi)發(fā)企業(yè)Web程序的服務(wù)器端技術(shù)，通過(guò)Websockets、互動(dòng)表單、視頻和地理標(biāo)簽等HTML5技術(shù)創(chuàng)建富媒體用戶體驗(yàn)。

四、Sencha Architect 2

在開(kāi)發(fā)移動(dòng)和桌面應(yīng)用的工具中，Sencha的定位是HTML5可視化應(yīng)用開(kāi)發(fā)。開(kāi)發(fā)團(tuán)隊(duì)可以在一個(gè)單一集成的環(huán)境中完成應(yīng)用的設(shè)計(jì)、開(kāi)發(fā)和部署。開(kāi)發(fā)者還可以開(kāi)發(fā)Sencha Touch2和Ext JS4 JavaScript應(yīng)用，并實(shí)時(shí)預(yù)覽。

五、Sencha Touch 2

Sencha Touch2是移動(dòng)應(yīng)用框架，也被看作是Sencha的HTML5平臺(tái)。開(kāi)發(fā)者可以用它開(kāi)發(fā)面向iOS、Android和Blackberry、Kindle Fire等多種平臺(tái)的移動(dòng)應(yīng)用。

六、Dojo Foundation Maqetta

來(lái)自于IBM的一個(gè)項(xiàng)目，Dojo Foundation Maqetta是為桌面和移動(dòng)設(shè)備開(kāi)發(fā)HTML5應(yīng)用的開(kāi)源工具，支持在瀏覽器中查看HTML5界面。用戶體驗(yàn)設(shè)計(jì)師可以通過(guò)拖放組裝UI樣板

七、微軟Visual Studio 2010 ServicePack 1

雖然一開(kāi)始并不支持HTML5，但微軟在2011年三月發(fā)布的Visual Studio 2010 SP1中提供了IntelliSense，追加了針對(duì)HTML5的一些元素。

八、JetBrains WebStorm 4.0

作為擁有HTML編輯器的JavaScript集成開(kāi)發(fā)環(huán)境，WebStorm4.0提供了開(kāi)發(fā)web應(yīng)用的HTML5樣板。開(kāi)發(fā)者可以在創(chuàng)建HTML文檔時(shí)可獲得對(duì)HTML5文件的支持。例如砍伐者鍵入。開(kāi)發(fā)者還可以在chrome瀏覽器中實(shí)時(shí)預(yù)覽HTML文檔。

九、Google Web Toolkit

該開(kāi)發(fā)工具用于開(kāi)發(fā)瀏覽器應(yīng)用，但庫(kù)中支持很多HTML5功能。包括對(duì)客戶端或web存儲(chǔ)的支持。其他HTML5功能還包括支持Canvas可視化，以及音頻和視頻widget。

十、DCloud HBuilder

HBuilder是當(dāng)前最快的HTML開(kāi)發(fā)工具，強(qiáng)大的代碼助手幫你快速完成開(kāi)發(fā)，最全的語(yǔ)法庫(kù)和瀏覽器兼容性數(shù)據(jù)讓瀏覽器碎片化不再頭痛。

程序員必須知道的HTML常用代碼有哪些

html+css代碼

文本設(shè)置

1、font-size: 字號(hào)參數(shù)

2、font-style: 字體格式

3、font-weight: 字體粗細(xì)

4、顏色屬性

color: 參數(shù)

注意使用網(wǎng)頁(yè)安全色

超鏈接設(shè)置

text-decoration: 參數(shù)

主要用途是改變?yōu)g覽器顯示文字鏈接時(shí)的下劃線。

參數(shù)取值范圍：

underline：為文字加下劃線

overline：為文字加上劃線

line-through：為文字加刪除線

blink：使文字閃爍

none：不顯示上述任何效果

背景

1、背景顏色

background-color: 參數(shù)

2、背景圖片

background-image: url(URL)

URL就是背景圖片的存放路徑，none表示無(wú)。

3、背景圖片重復(fù)

background-repeat: 參數(shù)

參數(shù)取值范圍 ：

no-repeat：不重復(fù)平鋪背景圖片

repeat-x：使圖片只在水平方向上平鋪

repeat-y：使圖片只在垂直方向上平鋪

如果不指定背景圖片重復(fù)屬性，瀏覽器默認(rèn)的是背景圖片向水平、垂直兩個(gè)方向上平鋪。

4、背景圖片固定

背景圖片固定控制背景圖片是否隨網(wǎng)頁(yè)的滾動(dòng)而滾動(dòng)。如果不設(shè)置背景圖片固定屬性，瀏覽器默認(rèn)背景圖片隨網(wǎng)頁(yè)的滾動(dòng)而滾動(dòng)。為了避免過(guò)于花哨的背景圖片在滾動(dòng)時(shí)轉(zhuǎn)移瀏覽者的注意力，一般都設(shè)為固定

background-attachment: 參數(shù)

參數(shù)取值范圍：

fixed：網(wǎng)頁(yè)滾動(dòng)時(shí)，背景圖片相對(duì)于瀏覽器的窗口而言，固定不動(dòng)

scroll：網(wǎng)頁(yè)滾動(dòng)時(shí)，背景圖片相對(duì)于瀏覽器的窗口而言，一起滾動(dòng)

區(qū)塊

1、單詞間距

word-spacing: 間隔距離

2、字母間距

letter-spacing: 字母間距

3、文本對(duì)齊

text-align: 參數(shù)

參數(shù)的取值：

left：左對(duì)齊

right：右對(duì)齊

center：居中對(duì)齊

justify：相對(duì)左右對(duì)齊

4、垂直對(duì)齊

vertical-align: 參數(shù)

top：頂對(duì)齊

bottom：底對(duì)齊

text-top：相對(duì)文本頂對(duì)齊

text-bottom：相對(duì)文本底對(duì)齊

baseline：基準(zhǔn)線對(duì)齊

middle：中心對(duì)齊

sub：以下標(biāo)的形式顯示

super：以上標(biāo)的形式顯示

5、文本縮進(jìn)

text-indent: 縮進(jìn)距離

12px相當(dāng)于一個(gè)文字距離

6、空格

white-space: 參數(shù)

normal 正常

pre 保留

nowrap 不換行

7、顯示樣式

display: 參數(shù)

參數(shù)取值范圍：

block：塊級(jí)元素，在對(duì)象前后都換行

inline：在對(duì)象前后都不換行

list-item：在對(duì)象前后都換行，增加了項(xiàng)目符號(hào)

none：無(wú)顯示

方框

1、height 高度

2、width 寬度

3、padding 內(nèi)邊距

4、margin 外邊距

5、float（浮動(dòng)）：可以讓塊級(jí)元素在一行中排列，例如橫向菜單。

6、clear 清除浮動(dòng)

邊框

1、樣式

border style 參數(shù)

邊框樣式的參數(shù)：

none：無(wú)邊框

dotted：邊框?yàn)辄c(diǎn)線

dashed：邊框?yàn)殚L(zhǎng)短線

solid：邊框?yàn)閷?shí)線

double：邊框?yàn)殡p線

2、寬度

border width 參數(shù)

3、顏色

border color 參數(shù)

列表

list-style-type 列表樣式

不同瀏覽器的列表符可能不相同，可能會(huì)影響到網(wǎng)頁(yè)，所以網(wǎng)頁(yè)中的列表大多都是由背景圖片顯示。

控制用戶界面的樣式

鼠標(biāo)

cursor：鼠標(biāo)形狀參數(shù)

CSS鼠標(biāo)形狀參數(shù)表：

鼠標(biāo)形狀：CSS代碼

style="cursor:hand" 　手形

style="cursor:crosshair" 十字形

style="cursor:text" 　文本形

style="cursor:wait" 　沙漏形

style="cursor:move" 十字箭頭形：

style="cursor:help" 　問(wèn)號(hào)形

style="cursor:e-resize" 　右箭頭形

style="cursor:n-resize" 　上箭頭形

style="cursor:nw-resize" 左上箭頭形

style="cursor:w-resize" 　左箭頭形

style="cursor:s-resize" 　下箭頭形

style="cursor:se-resize" 右下箭頭形

style="cursor:sw-resize" 左下箭頭形

HTML常用代碼之：結(jié)構(gòu)性定義

文件類型HTML/HTML （放在檔案的開(kāi)頭與結(jié)尾）

文件主題TITLE/TITLE （必須放在「文頭」區(qū)塊內(nèi)）

文頭HEAD/HEAD （描述性資料，像是「主題」）

文體BODY/BODY （文件本體）

標(biāo)題H?/H? （從1到6，有六層選擇）

標(biāo)題的對(duì)齊 H?ALIGN=LEFT|CENTER|RIGHT/H?

區(qū)分DIV/DIV

區(qū)分的對(duì)齊 DIVALIGN=LEFT|RIGHT|CENTER|JUSTIFY/DIV

引文區(qū)塊BLOCKQUOTE/BLOCKQUOTE （通常會(huì)內(nèi)縮）

強(qiáng)調(diào)EM/EM （通常會(huì)以斜體顯示）

特別強(qiáng)調(diào)STRONG/STRONG （通常會(huì)以加粗顯示）

引文CITE/CITE （通常會(huì)以斜體顯示）

碼CODE/CODE （顯示原始碼之用）

樣本SAMP/SAMP

鍵盤輸入KBD/KBD

變數(shù)VAR/VAR

定義DFN/DFN （有些瀏覽器不提供）

地址 ADDRESS/ADDRESS

大字BIG/BIG

小字SMALL/SMALL

與外觀相關(guān)的標(biāo)簽（作者自訂的表現(xiàn)方式）

加粗B/B

斜體I/I

底線U/U （尚有些瀏覽器不提供）

刪除線S/S （尚有些瀏覽器不提供）

下標(biāo)SUB/SUB

上標(biāo)SUP/SUP

打字機(jī)體TT/TT （用單空格字型顯示）

預(yù)定格式PRE/PRE （保留文件中空格的大?。?/p>

預(yù)定格式的寬度PRE WIDTH=?/PRE（以字元計(jì)算）

向中看齊CENTER/CENTER （文字與圖片都可以）

閃耀BLINK/BLINK （有史以來(lái)最被嘲弄的標(biāo)簽）

字體大小 FONTSIZE=?/FONT（從1到7）

改變字體大小 FONTSIZE=+|-?/FONT

基本字體大小 BASEFONTSIZE=? （從1到7; 內(nèi)定為3）

字體顏色 FONTCOLOR="#$$"/FONT（$$為顏色代碼）

HTML常用代碼之：修改頁(yè)面的實(shí)用性HTML代碼

貼圖：img src="圖片地址"

加入連接：a href="所要連接的相關(guān)地址"寫上你想寫的字/a

在新窗口打開(kāi)連接：a href="相關(guān)地址" target="_blank"寫上要寫的字/a

移動(dòng)字體(走馬燈)：marquee寫上你想寫的字/marquee

字體加粗：b寫上你想寫的字/b

字體斜體：i寫上你想寫的字/i

字體下劃線: u寫上你想寫的字/u

字體刪除線: s寫上你想寫的字/s

字體加大: big寫上你想寫的字/big

字體控制大?。篽1寫上你想寫的字/h1 (其中字體大小可從h1-h5,h1最大，h5最小)

更改字體顏色：font color="#value"寫上你想寫的字/font(其中value值在000000與ffffff(16位進(jìn)制)之間

消除連接的下劃線：a href="相關(guān)地址" style="text-decoration:none"寫上你想寫的字/a

貼音樂(lè)：embed src="音樂(lè)地址" width="寬度" height="高度" autostart=false

貼flash: embed src="flash地址" width="寬度" height="高度"

貼影視文件：img dynsrc="文件地址" width="寬度" height="高度" start=mouseover

換行：br

段落：p段落/p

原始文字樣式：pre正文/pre

換帖子背景：body background="背景圖片地址"

固定帖子背景不隨滾動(dòng)條滾動(dòng)：body background="背景圖片地址" body bgproperties=fixed

定制帖子背景顏色：body bgcolor="#value"(value值見(jiàn)10)

帖子背景音樂(lè)：bgsound="背景音樂(lè)地址" loop=infinite

貼網(wǎng)頁(yè)：iframe. src="相關(guān)地址" width="寬度" height="高度"/iframe

HTML常用代碼之：常常會(huì)遇到的問(wèn)題

點(diǎn)擊關(guān)閉窗口

a href="javascript.:top.window.close();"點(diǎn)擊關(guān)閉窗口/a！

請(qǐng)問(wèn)如何去掉主頁(yè)右面的滾動(dòng)條？

body scroll="no"

body style="overflow-y:hidden"

如何做到讓一個(gè)網(wǎng)頁(yè)自動(dòng)關(guān)閉.

html

head

OBJECT id=closes type="application/x-oleobject" classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"

param name="Command" value="Close"

/object

/head

body

這個(gè)窗口會(huì)在10秒過(guò)后自動(dòng)關(guān)閉,而且不會(huì)出現(xiàn)提示. /body

如何在不刷新頁(yè)面的情況下刷新css?

style

button{ color:#000000;}

/style

button nclick=document.styleSheets[0].rules[0].style.color=‘‘‘‘red‘‘‘‘點(diǎn)擊按鈕直接修改style標(biāo)簽里button選擇符使按鈕改為紅色/button

請(qǐng)問(wèn)如何讓網(wǎng)頁(yè)自動(dòng)刷新？

在head部記入META. HTTP-EQUIV="Refresh" c其中20為20秒后自動(dòng)刷新，你可以更改為任意值。

如何讓頁(yè)面自動(dòng)刷新？

方法一，用refresh

HTML 代碼片段如下:

head

meta. http-equiv="refresh" c

/head

5表示刷新時(shí)間

[Ctrl+A 全部選擇 提示:你可先修改部分代碼，再按運(yùn)行]

方法二，使用setTimeout控制

img src=/logo.gif

script

function rl(){

document.location.reload()

}

setTimeout(rl,2000)

/SCRIPT

如何讓超鏈接沒(méi)有下劃線

在源代碼中的HEAD…/HEAD之間輸入如下代碼：

style. type="text/css" !--

a { text-decoration: none}

-- /style

請(qǐng)問(wèn)如何去掉IE的上下滾動(dòng)條？

body style=‘‘‘‘overflow:scroll;overflow-y:hidden‘‘‘‘

/body

怎樣才能把RealPlayer文件在網(wǎng)頁(yè)做一個(gè)試聽(tīng)連接？

embed height=25　src=51js.rm type=audio/x-pn-realaudio-plugin width=50 autostart="false" c

如何用html實(shí)現(xiàn)瀏覽器上后退按鈕的功能？

a href="java script.:history.go(-1)"點(diǎn)擊后退/a

或者

script history.back() /SCRIPT

HTML常用代碼之：你不一定知道的技巧

ncontextmenu="window.event.returnValue=false" 將徹底屏蔽鼠標(biāo)右鍵

table borderncontextmenu=return(false)tdno/table 可用于Table

body nselectstart="return false" 取消選取、防止復(fù)制

onpaste="return false" 不準(zhǔn)粘貼

oncopy="return false;" ncut="return false;" 防止復(fù)制

link rel="Shortcut Icon"href="favicon.ico" IE地址欄前換成自己的圖標(biāo)

link rel="Bookmark"href="favicon.ico" 可以在收藏夾中顯示出你的圖標(biāo)

inputstyle="ime-mode:disabled" 關(guān)閉輸入法

永遠(yuǎn)都會(huì)帶著框架

script. language="JavaScript"!--

if (window == top)top.location.href = "frames.htm"; //frames.htm為框架網(wǎng)頁(yè)

// --/script

防止被人frame.

SCRIPT. LANGUAGE=JAVASCRIPT!--

if (top.location != self.location)top.location=self.location;

// --/SCRIPT

網(wǎng)頁(yè)將不能被另存為

noscriptiframe.src=*.html/iframe/noscript

查看網(wǎng)頁(yè)源代碼

input type=button value=查看網(wǎng)頁(yè)源代碼

onclick="window.location = "view-source:"+"""

刪除時(shí)確認(rèn)

a href="javascript:if(confirm("確實(shí)要?jiǎng)h除嗎?"))location="boos.asp? areyou=刪除page=1""刪除/a

屏蔽功能鍵Shift,Alt,Ctrl

script

function look(){

if(event.shiftKey)

alert("禁止按Shift鍵!");//可以換成ALT　CTRL

}

document.onkeydown=look;

/script

網(wǎng)頁(yè)不會(huì)被緩存

META. HTTP-EQUIV="pragma" CONTENT="no-cache"

META. HTTP-EQUIV="Cache-Control"CONTENT="no-cache, must-revalidate"

META. HTTP-EQUIV="expires"CONTENT="Wed, 26 Feb 1997 08:21:57 GMT"

或者M(jìn)ETA. HTTP-EQUIV="expires"CONTENT="0"

怎樣讓表單沒(méi)有凹凸感？

input type=text style="border:1 solid #000000"

input type=text style="border-left:none;border-right:none; border -top:none; border-bottom: 1 solid#000000"/textarea

不要滾動(dòng)條?

讓豎條沒(méi)有:

body style="overflow:scroll;overflow-y:hidden"

/body

讓橫條沒(méi)有:

body style="overflow:scroll;overflow-x:hidden"

/body

兩個(gè)都去掉？更簡(jiǎn)單了

body scroll="no"

/body

怎樣去掉圖片鏈接點(diǎn)擊后，圖片周圍的虛線？

a href="#"nFocus="this.blur()"img src="logo.jpg"border=0/a

電子郵件處理提交表單

form. name="form1"method="post" action="mailt****@***.com"enctype="text/plain"

input type=submit

/form

在打開(kāi)的子窗口刷新父窗口的代碼里如何寫？

window.opener.location.reload()

如何設(shè)定打開(kāi)頁(yè)面的大小

body nload="top.resizeTo(300,200);"

打開(kāi)頁(yè)面的位置bodynload="top.moveBy(300,200);"

在頁(yè)面中如何加入不是滿鋪的背景圖片,拉動(dòng)頁(yè)面時(shí)背景圖不動(dòng)

STYLE

body

{background-image:url(logo.gif); background-repeat:no-repeat;

background-position:center;background-attachment: fixed}

/STYLE

檢查一段字符串是否全由數(shù)字組成

script. language="Javascript"!--

function checkNum(str){return str.match(//D/)==null}

alert(checkNum("1232142141"))

alert(checkNum("123214214a1"))

// --/script

獲得一個(gè)窗口的大小

document.body.clientWidth; document.body.clientHeight

怎么判斷是否是字符

if (/[^/x00-/xff]/g.test(s)) alert("含有漢字");

else alert("全是字符");

TEXTAREA自適應(yīng)文字行數(shù)的多少

textarea rows=1 name=s1 cols=27npropertychange="this.style.posHeight=this.scrollHeight"

/textarea

日期減去天數(shù)等于第二個(gè)日期

script. language=Javascript

function cc(dd,dadd)

{

//可以加上錯(cuò)誤處理

var a = new Date(dd)

a = a.valueOf()

a = a - dadd * 24 * 60 * 60 * 1000

a = new Date(a)

alert(a.getFullYear() + "年" + (a.getMonth() +1) + "月" + a.getDate() + "日")

} cc("12/23/2002",2)

/script

選擇了哪一個(gè)Radio

HTMLscript. language="vbscript"

function checkme()

for each ob in radio1

if ob.checked then window.alert ob.value

next

end function

/scriptBODY

INPUT name="radio1" type="radio"value="style" checkedStyle.

INPUT name="radio1" type="radio"value="barcode"Barcode

INPUT type="button" value="check"nclick="checkme()"

/BODY/HTML

腳本永不出錯(cuò)

SCRIPT. LANGUAGE="JavaScript"

!-- Hide function killErrors(){return true;} window.onerror = killErrors;// --

/SCRIPT

ENTER鍵可以讓光標(biāo)移到下一個(gè)輸入框

input nkeydown="if(event.keyCode==13)event.keyCode=9"

電腦制作h5最常用軟件代碼的介紹就聊到這里吧，感謝你花時(shí)間閱讀本站內(nèi)容，更多關(guān)于免費(fèi)制作h5最常用軟件、電腦制作h5最常用軟件代碼的信息別忘了在本站進(jìn)行查找喔。