網頁制作html代碼
提問問題
列表
-
怎么看網頁是HTML5+CSS3做出來的
查看答案>>
-
有哪些不用編寫代碼就能輕松制作生成HTML5頁面的工具
查看答案>>
-
html網頁制作中,把圖片放在左下方怎么做
查看答案>>
-
如何用html制作網頁 源代碼
查看答案>>
-
手機html網頁和電腦上的html網頁在制作上有什么區(qū)別
查看答案>>
-
簡單網頁代碼設計
查看答案>>
-
Html網頁制作，用dw做坐等代碼。
查看答案>>
-
用HTML代碼設計如下網頁
查看答案>>
-
請問在網頁制作中加入一條水平線的HTML代碼是什么？
查看答案>>
怎么看網頁是HTML5+CSS3做出來的
沒法直接看出來，至少得看源文件（一般對網頁單擊右鍵就有相應選項，不同瀏覽器選項不同），分析是否使用了HTML5新增的標簽主要是<video>、<audio>、<canvas>、<section>、<article>、<header>、<nav>。CSS3則需要看有沒有使用CSS3新增的屬性，比如“border-radius”、“text-shadow”、“transform”以及“transition”等等。想完成這些工作，要求你對HTML和CSS都有相當的了解。最后，如果網頁最上方的文檔聲明不是”<!DOCTYPE html>“，則肯定不是HTML5。
有哪些不用編寫代碼就能輕松制作生成HTML5頁面的工具
HTML5頁面制作工具，大體分為兩類：基于HTML5的網站工具和手機APP工具（當然還有一些其他的，例如基于微信公眾號的等，下面也會介紹）?！ ∠瓤偟恼f一下個人感受1.基于HTML5的工具網站：功能較強大，單頁面的操作性較強，可完成各種頁面交互效果；但是某些時候會有操作“失靈”的現象，如上傳圖片失敗，點擊保存失敗，生成失敗等。原因你懂得~2.手機工具APP：相比起工具網站來講，顯得比較順手，有大量模板套用，制作簡單快捷；但是拘泥于現有的模板，使得單頁面不會有較大的可操作空間，從而無法實現DIY交互效果。 下面展開說下每個使用過的工具吧基于HTML5的工具網站：【兔展】 優(yōu)點：頁面DIY程度較高，動效實現起來也簡易方便，可制作比較任性的H5頁面。缺點：屏幕界面大小不可調節(jié)，上傳的圖會比例失調；生成后到各尺寸屏上頁面會存在拉伸現象。（此圖意在說明上傳的圖片的尺寸都是網站自己默認的一個尺寸，不是圖片本身的尺寸，不利于使用者調整）【MAKA.im】 可以具體編輯，單頁操作性較高，有新手（有模板）和高階（無模板）兩種編輯模式；翻頁效果比兔展多，模板也更強大一些?！揪痈呋涌?優(yōu)點：最簡單易上手的工具之一，根據提示一步一步的添加，共4步，最后生成微雜志。相比其他在線工具，較穩(wěn)定。缺點：目前沒試通制作單頁上的交互效果，沒找到開啟pro功能的入口?！続NIMATRON】 優(yōu)點：像flash的在線版，功能強大，可以創(chuàng)建HTML5動畫。適合有動畫基礎的人做演示制作。缺點：需要動畫制作基礎；工作界面響應時間長；貌似只能分享到twitter、Facebook、google+、tumblr？【iSpring 7】 噱頭是PPT轉HTML5工具，完美與PPT兼容，可制作Html5移動課件。不過，目前我只能連著VPN再用Safari才能打開網站鏈接?！拘阒谱鳌?優(yōu)點：版式輕松，制作快捷，寬帶穩(wěn)定。缺點：對圖片和文字在各種屏幕上的顯示沒有做很好的適配；不能對模板中文字的編輯調整位置。手機工具APP：【初頁】優(yōu)點：模板質量高，套用模板編輯時效率高，操作簡單快捷，效果和體驗在制作H5頁面的APP工具里面算是出類拔萃。缺點：單頁面可操作性較低，僅支持套用模板?！究煅s】快速制作邀請函優(yōu)點：易上手，省時高效，便于統計。缺點：頁面簡陋，只能選擇固有模板創(chuàng)建文字和添加圖片?！疽灼笮恪恐行∥⑵髽I(yè)的移動場景營銷管家優(yōu)點：套用模板，創(chuàng)建快捷，用來做企業(yè)介紹、產品推薦。擁有強大的推廣統計、客戶管理功能。嗯，這里應該贊一個。缺點：只能用模板，DIY程度低；統計數據是否準確需要進一步確認，目前看來可能有遺漏數據的現象（在小范圍測試中，統計到的數量小于應有的數量）?！疚①N】：通過微信公眾號創(chuàng)建H5頁面優(yōu)點：手機公眾號內直接創(chuàng)建簡單頁面，根據提示創(chuàng)建即可，無腦方便快捷。缺點：只是單頁面展示，承載不了交互效果等特效和內容。 總結 工具網站做的H5頁面，多注重單獨頁面的自定義交互方案，DIY程度高，相對來說用時較長，又受制于帶寬因素，故影響操作；工具APP做的H5頁面，多注重效率，目前都是套用模板，因而對單頁面的DIY程度較低，交互效果受限。作為我個人而言，移動互聯的新任PM，我平時常用到的是【MAKA】和【兔展】，這兩個相對來說更適合半天時間來完成；如想快速制作展示頁面就用【初頁】，這個在功能效率與設計感方面更突出一些；組織活動、制作邀請函、分發(fā)活動通知等用【快邀約】；平時推廣新產品、聯絡客戶和招聘新人用【易企秀】。轉載
html網頁制作中,把圖片放在左下方怎么做
用嵌套的div來相對定位：<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>上面是個例子下面的代碼解釋 ：margin-left:100px;就是距離背景層左邊的距離為100像素，margin-top:50px; 就是距離背景層上邊的距離為50像素；如果你想把圖放到左下方的地方，就用margin-left:100px;右邊的話就用margin-right:100px;代碼第一行打括號的地方就是放圖片鏈接的自己拿去再稍加琢磨，應該很快就可以搞定了！htm代碼其實很容易懂的！祝你成功吧
如何用html制作網頁 源代碼
制作一個網頁起碼要用到HTML、CSS、JavaScript，PHP（ASP）等語言，如果你只是要靜態(tài)無裝飾頁面，這就可以了123456789<!DOCTYPE html><html><head> <title></title></head><body> </body></html>
手機html網頁和電腦上的html網頁在制作上有什么區(qū)別
在工具上，手機版網頁和電腦版網頁沒有什么區(qū)別，可以根據自己的喜好。我是喜歡用Dreamweaver的，而且Dreamweaver cs6有個多屏預覽的功能，可以很方便的預覽手機、平板、PC端的效果。不過Dreamweaver 挺大的，還有很多比較快比較好的編輯器，比如EditPlus，這還是看個人的習慣和喜好了。推薦一個編輯器sublime text，我自己覺得超好用。在代碼方面的話：首先得加上這樣的一行。設置寬度、高度、是否能夠縮放。<meta name="viewport" content="width=device-width,inital-scale=1.0,minimum-scale=0.5,maximum-scale=2.0,user-scalable=no">然后，主要是要考慮適配。比較好的是做到自適應。這個可以搜一下，我記得月光博客里面就有篇很詳細的。其次，可以用@media only screen and(min-device-width : 320px) and(max-device-width : 480px){ }來對不同像素的屏幕寫不同的樣式。可以看下知乎的登錄頁面，用的就是@media。再然后要考慮的是用戶體驗。簡單的拿個鏈接來說，在PC端因為有鼠標，很容易點到。可是手機端就不一樣，就幾個字的鏈接很難點到，所以就要擴大點的面積。這就是為什么會出現電腦版的網頁和手機版網頁。其實做手機版的網頁有個好處就是可以大量的使用HTML5和CSS3，這樣能做出很多效果。對于這些的話，看附件里面的學習方法有幫助的很抱歉，回答者上傳的附件已失效
簡單網頁代碼設計
<!doctype html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>無標題 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網頁制作，用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("請輸入主題"); form.zt.focus(); return false; }else if(form.xq.value.replace(reg, "") == ""){ alert("請輸入詳細需求"); form.xq.focus(); return false; }else if(form.sqr.value.replace(reg, "") == ""){ alert("輸入申請人"); 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("聯系電話不符規(guī)格"); form.tel.focus(); form.tel.select(); return false; }else if(form.num.value.replace(reg, "") == ""){ alert("輸入QQ/微信號"); form.num.focus(); return false; } return true; } </script> </head> <body> <form class="wrap" onsubmit="return ck(this)"> <table> <caption> 定制申請 </caption> <tr> <td> *主題: </td> <td> <input type="text" name="zt" /> </td> </tr> <tr> <td style="vertical-align:top;"> *詳細需求: </td> <td> <textarea name="xq"></textarea> </td> </tr> <tr> <td> *申請人: </td> <td> <input type="text" name="sqr" /> </td> </tr> <tr> <td> *聯系電話: </td> <td> <input type="text" name="tel" /> </td> </tr> <tr> <td> *QQ/微信號: </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代碼設計如下網頁
12345678910111213141516171819202122232425262728293031323334353637<!DOCTYPE html><html> <head> <meta charset="GB2312"> <title>網頁設計實驗</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>把代碼復制到文本文檔中，保存為Html格式，在當前目錄下放一張名字為“1.jpg”的圖片就行了。
請問在網頁制作中加入一條水平線的HTML代碼是什么？
網頁中制作一條水平線的HTML代碼有很多方法可以實現。下面說幾種常用的。使用html中的border屬性來設置一條水平線如代碼：<div style="width:500px; border:1px solid red;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節(jié)-->使用hr標簽可以制作一條水平直線如代碼：<hr/><!--這個標簽的涵義就是一條水平的直線，但是不靈活，現在基本沒人使用！-->使用background-color來制作一條線，和border基本類似如代碼：<div style="width:500px; height:1px;background-color:red;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節(jié)-->可利用背景圖來實現和background-color原理一樣如代碼：<div style="width:500px; height:1px;background:url(背景圖的路徑) repeat-x;"></div><!--復制到html文件中就會是一條紅色水平直線，線的顏色、長短、可自己調節(jié)-->
