js网页制作
怎么制作html5网站页面让它适应电脑和手机的尺寸
用以下代码开头:<!DOCTYPE HTML><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">使用百分比定义宽度,, CSS代码可以适当使用:@media only screen and (max-width:449px){}自动根据屏幕像素 调用不同的CSS代码。
网页制作:页面中有两个表格,用js或者jquery实现将其中一个表格的某一行复制到另一个表格的一行。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript" src="js/jquery-1.6.1.min.js"></script><style type="text/css">table{ border-collapse:collapse; margin-top:20px;}td{ border:1px solid #000;}</style><script type="text/javascript"> $(function(){ $("table:eq(0) tr:eq(1)")//获取第一个表格的第二行N .clone()//复制 .insertAfter("table:eq(1) tr:eq(0)");//插入到第二个表格的第一行后面 })</script></head><body> <table> <tr> <td>表格1第一行</td><td>表格1第一行</td> </tr> <tr> <td>表格1第二行</td><td>表格1第二行</td> </tr> <tr> <td>表格1第三行</td><td>表格1第三行</td> </tr> </table> <table> <tr> <td>表格2第一行</td><td>表格2第一行</td> </tr> <tr> <td>表格2第二行</td><td>表格2第二行</td> </tr> <tr> <td>表格2第三行</td><td>表格2第三行</td> </tr> </table></body></html>
用JS做一个简单的网页计算器如图所示,只进行简单的加减乘除运算(最好有完整代码)
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>计数器</title></head><body> <input type="text" name="text" id="pre" onblur="validate(this.value);"> <select id="operator"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type="text" name="text" id="next" onblur="validate(this.value);"> <span>=</span> <input type="text" id="result" readonly="true"> <input type="button" id="btn" value="提交" onclick="calculator();"> <script> function validate(str){ var reg = /^\d+$/; if (!reg.test(str)) { alert("请输入数字"); } } function calculator(){ var pre=document.getElementById("pre").value; var next=document.getElementById("next").value; var opra=document.getElementById("operator").value; var result=0; switch(opra) { case "+": result=parseInt(pre)+parseInt(next); break; case "-": result=parseInt(pre)-parseInt(next); break; case "*": result=parseInt(pre)*parseInt(next); break; case "/": if(parseInt(next)!=0){ result=parseInt(pre)/parseInt(next); } else{ alert("除数不能为0"); return; } break; default: break; } document.getElementById("result").value=result; } </script></body></html>
html网页设计:一个简单的登录界面代码!
<!doctype html><html><head><meta charset="utf-8"><link href="main.css" type="text/css" rel="stylesheet"><title>登陆界面</title></head><body> <div class="login_ico"> <img src="images/login_ico.png"> </div> <div class="login_putin"> <ul> <li><input type="text" ></li> <li><input type="password" ></li> </ul> </div> <div class="login_btn"> <input type="submit" value="登陆"> </div></body></html>样式 :*{ margin:0; padding:0;}li{ list-style-type:none; margin:0; padding:0;}a{ text-decoration:none; color:#000;}/*---------------------按钮-----------------------------*/.login_putin ul li input{ margin: 0; width:70%; padding: 1em 2em 1em 5.4em; -webkit-border-radius:.3em; -moz-border-radius: .3em; border: 1px solid #999;}.login_btn{ width:300px; margin:40px auto 0 auto;}.login_btn input{ width:100%; margin:0; padding:.5em 0; -webkit-border-radius:.3em; -moz-border-radius: .3em; border:#1263be solid 1px; background:#1b85fd; color:#FFF; font-size:17px; font-weight:bolder; letter-spacing:1em;}.login_btn input:hover{ background:#1263be; }
利用Javascript实现用户注册信息检查,制作一个注册界面检测的javascript页面 要完整的网页代码,谢谢
//已发邮箱,注意查收。js部分代码如下: <script> function $(id){ return document.getElementById(id) } function clear_msg(){ set_msg(''); } function set_msg(msg){ $("tipmsg").innerHTML = msg; } function check_form(){ clear_msg(); var username = $('username').value, password = $('password').value, repasswd = $('repasswd').value, sex = $('sex').value, email = $('email').value; if(!/^[a-zA-Z]/.test(username)){ set_msg("请输入用户名,并以字母开头"); return false; } if(password.length == 0){ set_msg("请输入密码"); return false; } if(password!=repasswd){ set_msg("两次密码不一致,请修改"); return false; } if(sex.length == 0){ set_msg("请选择性别"); return false; } if(!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(email)){ set_msg("邮箱为空或格式不正确"); return false; } set_msg('<span style="color:#00ff00;">恭喜你!!!通过验证了</span>'); return false;//防止表单提交,如果后台有接口改为return true; 就可以提交表单了 } </script>
htm页面怎么用js做简单的上一页下一页代码
你说的这种应该是假分页。是指在一个html中存放很多div块,来表示每一页,然后点击某爷的按钮,该页就显示,其他页隐藏。实际中真正的分页是用ajax来实现的。建议学习。
怎么制作HTML网页,并通过邮箱发送
制作HTML网页可以用dreamweaver软件开发工具,对于新手来说是在适合不过,因为有很多标签和属性给与提示。只要你学会了html、DIV+CSS这两大块,完成一个静态的网站可以说搓搓有余了。如果你还想要将网站做的更加的华丽,你要需学习JS等知识。 通过邮箱发送HTML网页的方法:1、打开网页,邮件点击网页选择打开查看源代码。2、打开源代码页面后,看到html代码,将<body>部分全部复制。3、打开邮箱(这里使用的是QQ邮箱),点击在写信页面中的文字格式--HTML。4、然后将刚才复制的代码复制上去,但是由于网页上的图片和链接是调用的,当复制到邮件中后,需要将这些链接和图片都改成完全的地址和绝对地址。5、如图,可以将这张图和上一步骤的图进行比较。6、所有的链接都修改好后,可以先看看效果,点击左上角的返回可视化编辑。7、返回可视化界面后,会看到页面效果,但是由于网页编码的兼容性问题,网页的排版会和在浏览器中的有些差异,可以自己再调整下。8、调整好后就可以发送了。
网页制作中,文字内容太多,不想全在本页上显示,点击上面“更多”,就能看到全部内容,这个要怎么做?
用js写个脚本,展开收起的方式:我把代码黏上,您可以试试:【一、代码部分】<div id="hutia">1.即使生气,还是忍不住关心你,这才是真正爱你的人! 2.爱一个人,其实很简单。他让你流泪,让你失望,尽管这样,他站在那里,你还是会走过去牵他的手,不由自主。3.你拿了自己一生的幸福做赌注,要跟着我,你是这个世界上唯一这样信任我的人,我怎么舍得让你输。4.女人只会欺负对她好的男人,因为她知道即使他再委屈也不会离开她。一点点语录网5.世界上最美妙的一件事,就是当你拥抱一个你爱的人,他竟然把你抱得更紧。6.爱你就是,见不到你的时候,心里有好多话想和你说;你在身边时,觉得得静静地靠近你,即使不说话,也很好。7.相遇是一种美丽,相识是一种欢心,而相知是一种幸福。</div>【二、js部分】<script type="text/javascript">(function(){ var o = document.getElementById("hutia"); Subt(o); })(); function Subt(obj){ var s = obj.innerHTML; var p = document.createElement("span"); var n = document.createElement("a"); p.innerHTML = s.substring(0,100); n.innerHTML = s.length > 100 ? "...展开" : ""; n.href = "###"; n.onclick = function(){if (n.innerHTML == "...展开"){ n.innerHTML = "收起"; p.innerHTML = s;}else{ n.innerHTML = "...展开"; p.innerHTML = s.substring(0,100);} } obj.innerHTML = ""; obj.appendChild(p); obj.appendChild(n);} </script>
web前端开发都包括哪些技术
web前端开发包括的技术: 1、学好CSS是网页外观的重要一点,CSS可以帮助把网页外观做得更加美观。 2、div布局: DIV元素是用来为HTML文档内大块的内容提供结构和背景的元素。 2、学习JavaScript的基本语法,以及如何使用。JavaScript编程将会提高开发人员的个人技能。 3、了解Unix和Linux的基本知识虽然这两点很基础,但是开发人员了解Unix和Linux的基本知识是有益无害的。 4、html5+css3:移动端的网页制作。在移动设备开发HTML5应用只有两种方法,要不就是全使用HTML5的语法,要不就是仅使用JavaScript引擎,现在也是前端的一个趋势。 5、一些框架的应用:angular.js,node.js,bootsttap等框架的应用。 6、了解Web服务器对Apache的基本配置,并且掌握htaccess配置技巧 7、web前端开发技术,还需要学习一些seo优化技术,因为前端是经常会和网站接触的。 8、掌握web前端开发技术的同时,适当的学习一些后台开发语言(java,php等)也是一个不错的选择。