HTML简单实例加表单的显示效果

HTML可以说是一种十分简单的标记语言，但是对于Web开发还是必不可少的，所以对HTML的标记进行适当的了解

还是十分有必要的。下面我们来演示一下基本的HTML效果和一些简单的标签，以及在表单界面的各种提交方式。

首先是HTML的常用简单标签。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>hello.html</title> </head> <body> <font color="red" size="7">Hello World</font> <b>第一行文字</b> <p><font color="blue" size="4">第一行文字</font></p> <br/>*********字符实体案例************<br/> <font size="6">© £ ®</font> <br/>***********超链接实例************<br/>  <a href="/HTML/test/a.html" target="_blank">老鼠爱大米</a> <br/>**********图片元素*********<br/> <img alt="一只猫" src="/HTML/img/tomcat.gif" width="170px" border="1"/> <br/>*********表格**************<br/>  <table border="1" width="170" align="center" bgcolor="yellow" bordercolor="red" cellpadding="3" c> <tr align="center"> <td>1</td> <td>2</td> <td>3</td></tr> <tr align="center"> <td>4</td> <td>5</td> <td>6</td></tr> <tr align="center"> <td>7</td> <td>8</td> <td>9</td></tr> </table> </body> </html>
效果如下

下面是表单界面的显示，代码如下

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>提交选项</title> </head> <body> 名字:<input type="text" name="name"/><br/> 密码:<input type="password" name="password"/> <br/>************复选框***********<br/> <input type="checkbox" name="v1">西瓜<br/> <input type="checkbox" name="v1">苹果<br/> <br/>************单选框***********<br/> <input type="radio" name="sex">男<br/> <input type="radio" name="sex">女<br/> <br/>************隐藏域***********<br/> <input type="hidden" value="123" name="hiden"/> <br/>************下拉框***********<br/> <select name="place"> <option value="beijing">北京</option> <option value="beijing">天津</option> <option value="beijing">上海</option> </select> <br/>************文本框***********<br/> <textarea rows="10" cols="10" name="text"> 在这里留言 </textarea> <br/>************选择上传文件***********<br/> <input type="file" name="file"> </body> </html>
效果如下

posted on 2012-02-27 17:51 sp2012 阅读(298) 评论(0) 编辑收藏举报