HTML

最新推荐文章于 2022-01-03 21:26:35 发布

砺晗

最新推荐文章于 2022-01-03 21:26:35 发布

阅读量280

点赞数 1

分类专栏： Web前端

本文链接：https://blog.csdn.net/xiaowang627/article/details/54668809

版权

Web前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

一、HTML文档结构

1、HTML文档由4个主要标记组成，<html>、<head>、<title>、<body>

2、HTML标记不区分大小写

二、HTML常用标记

1、换行标记<br>，单独标记，不成对出现。

2、段落标记<p>，</p>

3、标题标记<h1></h1>至<h6></h6>

4、居中标记<center></center>

5、文字列表标记

5.1 无序列表：列表前用圆点标识

<ul>

<li>...

.......

</ul>

5.2 有序列表：队列表项排序

<ol>

<li>...

.......

<ol>

6、表格标记：标题，表头，行，单元格

6.1 表格标记<table></table>

6.2 标题标记<caption></caption>

6.3 表头标记<th></th>

6.4 表格行标记<tr></tr>

6.5 单元格标记<td></td>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>学生成绩表</title>
</head>
<body>
<table width="318" height="167" border="1" align="center">
	<caption>学生考试成绩单</caption>
	<tr>
		<td align="center" valign="middle"> 姓名 </td>
		<td align="center" valign="middle"> 语文 </td>
		<td align="center" valign="middle"> 数学 </td>
		<td align="center" valign="middle"> 英语 </td>
	</tr>
	<tr>
		<td align="center" valign="middle"> 张三 </td>
		<td align="center" valign="middle"> 89 </td>
		<td align="center" valign="middle"> 87 </td>
		<td align="center" valign="middle"> 97语 </td>
	</tr>
	<tr>
		<td align="center" valign="middle"> 李四 </td>
		<td align="center" valign="middle"> 100 </td>
		<td align="center" valign="middle"> 100 </td>
		<td align="center" valign="middle"> 100 </td>
	</tr>
	<tr>
		<td align="center" valign="middle"> 王五 </td>
		<td align="center" valign="middle"> 98 </td>
		<td align="center" valign="middle"> 97 </td>
		<td align="center" valign="middle"> 98 </td>
	</tr>
</table>
</body>
</html>

7、表单标记

7.1 表单标记<form action="url" method="get"|"post" name="name" onSubmint="" target=""></form>

action:指定处理表单数据程序的URL地址

method:常用post方式

name:该表单的名称，自定义

onSubmit:指定当用户点击提交按钮时触发的事件。

target:指定输入数据结果显示在哪个窗口：_blank:新窗口、_self:默认值，同一窗口、_top:整个窗口、_parent:上一级窗口

7.2 表单输入标记<input>

<input type="image" disabled="disabled" checked="checked" width="digit" height="digit" maxlength="digit"

readonly="" size="digit" src="url", usemap="url" alt="" name="checkbox" value="checkbox">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>表单标记</title>
</head>
<body>
<form action="" method="post" name="myform">
	用户名：<input name="username" type="text" id="UserName4" maxlength="20"><br>
	密码：<input name="pwd1" type="password" id="PWD14" size="20" maxlength="20"><br>
	确认密码：<input name="pwd2" type="password" id="PWD25" size="20" maxlength="20"><br>
	性别：<input name="sex" type="radio" class ="noborder" value="男" checked>
			男 
		  <input name="sex" type="radio" class ="noborder" value="女">
		       女<br>
	爱好：<input name="like" type="checkbox" id="like" value="体育">
					体育
					<input name="like" type="checkbox" id="like" value="旅游">
					旅游
					<input name="like" type="checkbox" id="like" value="听音乐">
					听音乐
					<input name="like" type="checkbox" id="like" value="看书">
					看书<br>
	E_Mail:<input name="email" type="text" id="PWD224" size="50">
		   <input name="Submit" type="submit" value="确定保存">
		   <input name="Reset" type="reset" id="Reset" value="重新填写">
		   <input name="Save" type="button" id="Save" value="保存">
</form>
</body>
</html>