網(wǎng)頁(yè)制作html代碼
提問(wèn)問(wèn)題
列表
-
怎么看網(wǎng)頁(yè)是HTML5+CSS3做出來(lái)的
查看答案>>
-
有哪些不用編寫代碼就能輕松制作生成HTML5頁(yè)面的工具
查看答案>>
-
html網(wǎng)頁(yè)制作中,把圖片放在左下方怎么做
查看答案>>
-
如何用html制作網(wǎng)頁(yè) 源代碼
查看答案>>
-
手機(jī)html網(wǎng)頁(yè)和電腦上的html網(wǎng)頁(yè)在制作上有什么區(qū)別
查看答案>>
-
簡(jiǎn)單網(wǎng)頁(yè)代碼設(shè)計(jì)
查看答案>>
-
Html網(wǎng)頁(yè)制作,用dw做坐等代碼。
查看答案>>
-
用HTML代碼設(shè)計(jì)如下網(wǎng)頁(yè)
查看答案>>
-
請(qǐng)問(wèn)在網(wǎng)頁(yè)制作中加入一條水平線的HTML代碼是什么?
查看答案>>
怎么看網(wǎng)頁(yè)是HTML5+CSS3做出來(lái)的
沒法直接看出來(lái),至少得看源文件(一般對(duì)網(wǎng)頁(yè)單擊右鍵就有相應(yīng)選項(xiàng),不同瀏覽器選項(xiàng)不同),分析是否使用了HTML5新增的標(biāo)簽主要是<video>、<audio>、<canvas>、<section>、<article>、<header>、<nav>。CSS3則需要看有沒有使用CSS3新增的屬性,比如“border-radius”、“text-shadow”、“transform”以及“transition”等等。想完成這些工作,要求你對(duì)HTML和CSS都有相當(dāng)?shù)牧私?。最后,如果網(wǎng)頁(yè)最上方的文檔聲明不是”<!DOCTYPE html>“,則肯定不是HTML5。
有哪些不用編寫代碼就能輕松制作生成HTML5頁(yè)面的工具
HTML5頁(yè)面制作工具,大體分為兩類:基于HTML5的網(wǎng)站工具和手機(jī)APP工具(當(dāng)然還有一些其他的,例如基于微信公眾號(hào)的等,下面也會(huì)介紹)?! ∠瓤偟恼f(shuō)一下個(gè)人感受1.基于HTML5的工具網(wǎng)站:功能較強(qiáng)大,單頁(yè)面的操作性較強(qiáng),可完成各種頁(yè)面交互效果;但是某些時(shí)候會(huì)有操作“失靈”的現(xiàn)象,如上傳圖片失敗,點(diǎn)擊保存失敗,生成失敗等。原因你懂得~2.手機(jī)工具APP:相比起工具網(wǎng)站來(lái)講,顯得比較順手,有大量模板套用,制作簡(jiǎn)單快捷;但是拘泥于現(xiàn)有的模板,使得單頁(yè)面不會(huì)有較大的可操作空間,從而無(wú)法實(shí)現(xiàn)DIY交互效果?! ∠旅嬲归_說(shuō)下每個(gè)使用過(guò)的工具吧基于HTML5的工具網(wǎng)站:【兔展】 優(yōu)點(diǎn):頁(yè)面DIY程度較高,動(dòng)效實(shí)現(xiàn)起來(lái)也簡(jiǎn)易方便,可制作比較任性的H5頁(yè)面。缺點(diǎn):屏幕界面大小不可調(diào)節(jié),上傳的圖會(huì)比例失調(diào);生成后到各尺寸屏上頁(yè)面會(huì)存在拉伸現(xiàn)象。(此圖意在說(shuō)明上傳的圖片的尺寸都是網(wǎng)站自己默認(rèn)的一個(gè)尺寸,不是圖片本身的尺寸,不利于使用者調(diào)整)【MAKA.im】 可以具體編輯,單頁(yè)操作性較高,有新手(有模板)和高階(無(wú)模板)兩種編輯模式;翻頁(yè)效果比兔展多,模板也更強(qiáng)大一些?!揪痈呋?dòng)刊】 優(yōu)點(diǎn):最簡(jiǎn)單易上手的工具之一,根據(jù)提示一步一步的添加,共4步,最后生成微雜志。相比其他在線工具,較穩(wěn)定。缺點(diǎn):目前沒試通制作單頁(yè)上的交互效果,沒找到開啟pro功能的入口。【ANIMATRON】 優(yōu)點(diǎn):像flash的在線版,功能強(qiáng)大,可以創(chuàng)建HTML5動(dòng)畫。適合有動(dòng)畫基礎(chǔ)的人做演示制作。缺點(diǎn):需要?jiǎng)赢嬛谱骰A(chǔ);工作界面響應(yīng)時(shí)間長(zhǎng);貌似只能分享到twitter、Facebook、google+、tumblr?【iSpring 7】 噱頭是PPT轉(zhuǎn)HTML5工具,完美與PPT兼容,可制作Html5移動(dòng)課件。不過(guò),目前我只能連著VPN再用Safari才能打開網(wǎng)站鏈接。【秀制作】 優(yōu)點(diǎn):版式輕松,制作快捷,寬帶穩(wěn)定。缺點(diǎn):對(duì)圖片和文字在各種屏幕上的顯示沒有做很好的適配;不能對(duì)模板中文字的編輯調(diào)整位置。手機(jī)工具APP:【初頁(yè)】?jī)?yōu)點(diǎn):模板質(zhì)量高,套用模板編輯時(shí)效率高,操作簡(jiǎn)單快捷,效果和體驗(yàn)在制作H5頁(yè)面的APP工具里面算是出類拔萃。缺點(diǎn):?jiǎn)雾?yè)面可操作性較低,僅支持套用模板。【快邀約】快速制作邀請(qǐng)函優(yōu)點(diǎn):易上手,省時(shí)高效,便于統(tǒng)計(jì)。缺點(diǎn):頁(yè)面簡(jiǎn)陋,只能選擇固有模板創(chuàng)建文字和添加圖片?!疽灼笮恪恐行∥⑵髽I(yè)的移動(dòng)場(chǎng)景營(yíng)銷管家優(yōu)點(diǎn):套用模板,創(chuàng)建快捷,用來(lái)做企業(yè)介紹、產(chǎn)品推薦。擁有強(qiáng)大的推廣統(tǒng)計(jì)、客戶管理功能。嗯,這里應(yīng)該贊一個(gè)。缺點(diǎn):只能用模板,DIY程度低;統(tǒng)計(jì)數(shù)據(jù)是否準(zhǔn)確需要進(jìn)一步確認(rèn),目前看來(lái)可能有遺漏數(shù)據(jù)的現(xiàn)象(在小范圍測(cè)試中,統(tǒng)計(jì)到的數(shù)量小于應(yīng)有的數(shù)量)?!疚①N】:通過(guò)微信公眾號(hào)創(chuàng)建H5頁(yè)面優(yōu)點(diǎn):手機(jī)公眾號(hào)內(nèi)直接創(chuàng)建簡(jiǎn)單頁(yè)面,根據(jù)提示創(chuàng)建即可,無(wú)腦方便快捷。缺點(diǎn):只是單頁(yè)面展示,承載不了交互效果等特效和內(nèi)容。 總結(jié) 工具網(wǎng)站做的H5頁(yè)面,多注重單獨(dú)頁(yè)面的自定義交互方案,DIY程度高,相對(duì)來(lái)說(shuō)用時(shí)較長(zhǎng),又受制于帶寬因素,故影響操作;工具APP做的H5頁(yè)面,多注重效率,目前都是套用模板,因而對(duì)單頁(yè)面的DIY程度較低,交互效果受限。作為我個(gè)人而言,移動(dòng)互聯(lián)的新任PM,我平時(shí)常用到的是【MAKA】和【兔展】,這兩個(gè)相對(duì)來(lái)說(shuō)更適合半天時(shí)間來(lái)完成;如想快速制作展示頁(yè)面就用【初頁(yè)】,這個(gè)在功能效率與設(shè)計(jì)感方面更突出一些;組織活動(dòng)、制作邀請(qǐng)函、分發(fā)活動(dòng)通知等用【快邀約】;平時(shí)推廣新產(chǎn)品、聯(lián)絡(luò)客戶和招聘新人用【易企秀】。轉(zhuǎn)載
html網(wǎng)頁(yè)制作中,把圖片放在左下方怎么做
用嵌套的div來(lái)相對(duì)定位:<div id="beijing" style="background-image:url(image/bg/nav_blue.gif); width:400px; height:200px;"><div style="margin-left:100px; margin-top:50px; border:#F00 solid 1px; width:80px; height:40px;"></div></div>上面是個(gè)例子下面的代碼解釋 :margin-left:100px;就是距離背景層左邊的距離為100像素,margin-top:50px; 就是距離背景層上邊的距離為50像素;如果你想把圖放到左下方的地方,就用margin-left:100px;右邊的話就用margin-right:100px;代碼第一行打括號(hào)的地方就是放圖片鏈接的自己拿去再稍加琢磨,應(yīng)該很快就可以搞定了!htm代碼其實(shí)很容易懂的!祝你成功吧
如何用html制作網(wǎng)頁(yè) 源代碼
制作一個(gè)網(wǎng)頁(yè)起碼要用到HTML、CSS、JavaScript,PHP(ASP)等語(yǔ)言,如果你只是要靜態(tài)無(wú)裝飾頁(yè)面,這就可以了123456789<!DOCTYPE html><html><head> <title></title></head><body> </body></html>
手機(jī)html網(wǎng)頁(yè)和電腦上的html網(wǎng)頁(yè)在制作上有什么區(qū)別
在工具上,手機(jī)版網(wǎng)頁(yè)和電腦版網(wǎng)頁(yè)沒有什么區(qū)別,可以根據(jù)自己的喜好。我是喜歡用Dreamweaver的,而且Dreamweaver cs6有個(gè)多屏預(yù)覽的功能,可以很方便的預(yù)覽手機(jī)、平板、PC端的效果。不過(guò)Dreamweaver 挺大的,還有很多比較快比較好的編輯器,比如EditPlus,這還是看個(gè)人的習(xí)慣和喜好了。推薦一個(gè)編輯器sublime text,我自己覺得超好用。在代碼方面的話:首先得加上這樣的一行。設(shè)置寬度、高度、是否能夠縮放。<meta name="viewport" content="width=device-width,inital-scale=1.0,minimum-scale=0.5,maximum-scale=2.0,user-scalable=no">然后,主要是要考慮適配。比較好的是做到自適應(yīng)。這個(gè)可以搜一下,我記得月光博客里面就有篇很詳細(xì)的。其次,可以用@media only screen and(min-device-width : 320px) and(max-device-width : 480px){ }來(lái)對(duì)不同像素的屏幕寫不同的樣式??梢钥聪轮醯牡卿涰?yè)面,用的就是@media。再然后要考慮的是用戶體驗(yàn)。簡(jiǎn)單的拿個(gè)鏈接來(lái)說(shuō),在PC端因?yàn)橛惺髽?biāo),很容易點(diǎn)到。可是手機(jī)端就不一樣,就幾個(gè)字的鏈接很難點(diǎn)到,所以就要擴(kuò)大點(diǎn)的面積。這就是為什么會(huì)出現(xiàn)電腦版的網(wǎng)頁(yè)和手機(jī)版網(wǎng)頁(yè)。其實(shí)做手機(jī)版的網(wǎng)頁(yè)有個(gè)好處就是可以大量的使用HTML5和CSS3,這樣能做出很多效果。對(duì)于這些的話,看附件里面的學(xué)習(xí)方法有幫助的很抱歉,回答者上傳的附件已失效
簡(jiǎn)單網(wǎng)頁(yè)代碼設(shè)計(jì)
<!doctype html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>無(wú)標(biāo)題 1</title><style type="text/css">td {width: 240px; height: 240px;}.center {text-align: center;}</style></head><body><table style="width: 960px; "><tr><td colspan="4" class="center">logo<img src="" alt="logo"></td></tr><tr><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td></tr><tr><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td></tr><tr><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td><td>圖片<img src="" alt="圖片"></td></tr></table></body></html>
Html網(wǎng)頁(yè)制作,用dw做坐等代碼。
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title> RunJS 演示代碼 </title> <style> *{ margin:0; outline:none; } .wrap{ margin:auto; width:500px; height:450px; background-color:white; border:1px solid gray; border-radius:5px; } table{ width:100%; border-collapse:collapse; font:normal 13px '微軟雅黑'; } caption{ font-size:20px; color:rgb(158, 99, 99); padding:12px; } td input[type=text]{ border:1px solid rgb(46, 128, 216); border-radius:5px; width:80%; height:25px; } tr{ line-height:50px; } td textarea{ resize:none; width:80%; height:100px; border:1px solid rgb(46, 128, 216); border-radius:5px; } tr td:first-child{ text-align:right; } td input[type=submit], td input[type=reset]{ background-color:rgb(52, 114, 143); color:white; border:0; width:75px; height:25px; border-radius:5px; cursor:pointer; margin:10px; } </style> <script> var ck = function(form){ var reg = /^\s+|\s+$/g; if(form.zt.value.replace(reg, "") == ""){ alert("請(qǐng)輸入主題"); form.zt.focus(); return false; }else if(form.xq.value.replace(reg, "") == ""){ alert("請(qǐng)輸入詳細(xì)需求"); form.xq.focus(); return false; }else if(form.sqr.value.replace(reg, "") == ""){ alert("輸入申請(qǐng)人"); form.sqr.focus(); return false; }else if(!/^1([38]\d|4[57]|5[0-35-9]|7[06-8])\d{8}$/.test(form.tel.value.replace(reg, ""))){ alert("聯(lián)系電話不符規(guī)格"); form.tel.focus(); form.tel.select(); return false; }else if(form.num.value.replace(reg, "") == ""){ alert("輸入QQ/微信號(hào)"); form.num.focus(); return false; } return true; } </script> </head> <body> <form class="wrap" onsubmit="return ck(this)"> <table> <caption> 定制申請(qǐng) </caption> <tr> <td> *主題: </td> <td> <input type="text" name="zt" /> </td> </tr> <tr> <td style="vertical-align:top;"> *詳細(xì)需求: </td> <td> <textarea name="xq"></textarea> </td> </tr> <tr> <td> *申請(qǐng)人: </td> <td> <input type="text" name="sqr" /> </td> </tr> <tr> <td> *聯(lián)系電話: </td> <td> <input type="text" name="tel" /> </td> </tr> <tr> <td> *QQ/微信號(hào): </td> <td> <input type="text" name="num" /> </td> </tr> <tr> <td colspan=2 style="text-align:center;"> <input type="submit" value="提交" /> <input type="reset" value="重填" /> </td> </tr> </table> </form> </body></html>
用HTML代碼設(shè)計(jì)如下網(wǎng)頁(yè)
12345678910111213141516171819202122232425262728293031323334353637<!DOCTYPE html><html> <head> <meta charset="GB2312"> <title>網(wǎng)頁(yè)設(shè)計(jì)實(shí)驗(yàn)</title> </head> <body> <table border="1" width="100%" height="200px"> <tr> <td width="50%"> <table border="0" width="100%" height="100px"> <tr> <td style="font-size: 10px;font-family: '宋體';color: red;">宋體</td> </tr> <tr> <td align="middle" style="font-size: 14px;font-family: '微軟雅黑';color: green;">微軟雅黑</td> </tr> <tr> <td align="right" style="font-size: 18px;font-family: '黑體';color: blue;">黑體</td> </tr> </table> </td> <td align="middle"><img src="1.jpg" height="100px" width="100px"></td> </tr> <tr align="middle"> <td width="50%"><a /> </body></html>把代碼復(fù)制到文本文檔中,保存為Html格式,在當(dāng)前目錄下放一張名字為“1.jpg”的圖片就行了。
請(qǐng)問(wèn)在網(wǎng)頁(yè)制作中加入一條水平線的HTML代碼是什么?
網(wǎng)頁(yè)中制作一條水平線的HTML代碼有很多方法可以實(shí)現(xiàn)。下面說(shuō)幾種常用的。使用html中的border屬性來(lái)設(shè)置一條水平線如代碼:<div style="width:500px; border:1px solid red;"></div><!--復(fù)制到html文件中就會(huì)是一條紅色水平直線,線的顏色、長(zhǎng)短、可自己調(diào)節(jié)-->使用hr標(biāo)簽可以制作一條水平直線如代碼:<hr/><!--這個(gè)標(biāo)簽的涵義就是一條水平的直線,但是不靈活,現(xiàn)在基本沒人使用!-->使用background-color來(lái)制作一條線,和border基本類似如代碼:<div style="width:500px; height:1px;background-color:red;"></div><!--復(fù)制到html文件中就會(huì)是一條紅色水平直線,線的顏色、長(zhǎng)短、可自己調(diào)節(jié)-->可利用背景圖來(lái)實(shí)現(xiàn)和background-color原理一樣如代碼:<div style="width:500px; height:1px;background:url(背景圖的路徑) repeat-x;"></div><!--復(fù)制到html文件中就會(huì)是一條紅色水平直線,線的顏色、長(zhǎng)短、可自己調(diào)節(jié)-->
熱門問(wèn)答
- 模版還是模板
- 免費(fèi)建站
- 淘寶網(wǎng)頁(yè)是哪個(gè)公司做的
- 免費(fèi)制作企業(yè)
- 簡(jiǎn)單個(gè)人網(wǎng)站模板
- 制作網(wǎng)站的的網(wǎng)站
- 怎么學(xué)網(wǎng)頁(yè)設(shè)計(jì)
- html模板文件
- 手機(jī)網(wǎng)站的優(yōu)化
- 什么是排版設(shè)計(jì)
- 廣告公司網(wǎng)站制作
- 網(wǎng)站優(yōu)化是什么
- 怎么用手機(jī)制作簡(jiǎn)歷
- 武漢建設(shè)網(wǎng)站
- 網(wǎng)站建設(shè)公司怎么樣
- seo優(yōu)化培訓(xùn)
- 網(wǎng)站的建設(shè)哪家好
- 制作簡(jiǎn)歷圖片
- 什么是網(wǎng)絡(luò)推廣優(yōu)化
- 網(wǎng)頁(yè)制作學(xué)那些