导语:在学习PHP之前,个人觉得有必要体验一下HTML(对于半路出家的人)。
HTML(Hypertext Markup Language):超文本标记,用于描述网页文档的一种标记语言。最新版为HTML5。
基本页面结构:
<html>
<head></head>
<body>
......
</body>
</html>
常用的elements
表单:可以说每个网站都离不开表单,表单是最常用的人机数据交互方式之一。
<form action="" method="post">
<input type=""/>
</form>
action:指定提交处理页面的URL
method:指定提交表单的方式,有get、post两种方式,默认为get方式。关于这两种方式的区别:问google
type:属性可取值
值 | 描述 |
---|---|
button | 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。 |
checkbox | 定义复选框。 |
file | 定义输入字段和 "浏览"按钮,供文件上传。 |
hidden | 定义隐藏的输入字段。 |
image | 定义图像形式的提交按钮。 |
password | 定义密码字段。该字段中的字符被掩码。 |
radio | 定义单选按钮。 |
reset | 定义重置按钮。重置按钮会清除表单中的所有数据。 |
submit | 定义提交按钮。提交按钮会把表单数据发送到服务器。 |
text | 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。 |
<!DOCTYPE>
<HTML>
<!-- This is note -->
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- 页面的标题 -->
<title>my html page</title>
</HEAD>
<BODY>
<!-- 空格符 -->
<!-- 分割线 noshade:代表实体线-->
<hr noshade />
<!-- 段落 -->
<p></p>
<!-- 链接
target属性
(1)_blank:在新窗口中打开被链接文档
(2)_self:在相同的框架中打开被链接文档
(3)_parent:在父框架中打开被链接文档
(4)_top:在整个窗口中打开被链接文档
(5)view_window:打开新窗口
(6)framename:在指定的框架中打开被链接文档
-->
<a href="url" target="">link</a>
<!-- 图片插入 -->
<img src="image_url" />
<!-- 表格 -->
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
<!-- 有序列表 -->
<ol>
<li>one</li>
<li>two</li>
<li>three</li>
</ol>
<!-- 无序列表 -->
<ul>
<li>Java</li>
<li>PHP</li>
<li>C++</li>
</ul>
<!-- 自定义列表 -->
<dl>
<dt>working</dt>
<dd>rest</dd>
</dl>
<!-- 内联框架 -->
<iframe src="page_url"></iframe>
<!-- 框架集:使用框架集可以在同一个浏览器窗口中显示一个以上的页面
使用注意:使用的页面不能有<body>标签
<frameset rows="50%,*">
<frame src="page_url"/>
<frameset cols="20%">
<frame src="page_url"/>
<frame src="page_url"/>
</frameset>
</frameset>
-->
<!-- 表单 -->
<form action="" method="post">
button:<input type="button" /><br />
单行文本框:<input type="text" /><br />
密码框:<input type="password" /><br />
<!--单选框-->
<input type="checkbox" name="sex" value="man"/>男
<input type="checkbox" name="sex" value="women"/>女 <br/>
<!--复选框 checked 默认选中-->
<input type="checkbox" name="cities" value="beijing"/>北京
<input type="checkbox" name="cities" value="shanghai"/>上海
<input type="checkbox" name="cities" value="guangzhou"/>广州
<input type="checkbox" name="cities" value="shenzhen"/>深圳 <br/>
<input type="hidden" />
<!--下拉列表-->
<select name="music">
<option value="nobody" selected="selected">nobody</option>
<option value="because">because</option>
<option value="alone">alone</option>
</select><br/>
<!--文本框-->
<textarea>
message
</textarea><br/>
<!--文件上传-->
<input type="file" />上传<br/>
<!--带标题的表单框-->
<fieldset>
<legend>title:</legend>
<label>label1:<input type="text" /></label>
<label>label2:<input type="text" /></label>
</fieldset>
<!--图片按钮-->
<input type="image" src="img_url"/>
<!-- 提交 -->
<input type="submit" value="login"/>
<input type="reset" value="cancel"/>
</form>
<!-- 图片、文字移动 -->
<marquee direction="left" scrollamount="10">left</marquee><br/>
<marquee direction="right"scrollamount="20">right</marquee><br/>
<!--声音、视频-->
<audio controls="controls">
<source src="/i/song.ogg" type="audio/ogg">
<source src="/i/song.mp3" type="audio/mpeg">
<embed height="100" width="100" src="/i/song.mp3"/>
</audio>
</BODY>
</HTML>
其他标签方面的学习个人建议参考:http://www.w3schools.com/