一、html文档结构：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
<html>标记：没有实际意义，但是是html文件不可缺失的。不区分大小写
<head>标记：HTML文件的头标记，放置HTML文件信息，如定义的CSS样 式的代码。
<title>标记：网页标题标记
<body>标记：HTML页面的主体标记，本身也具有一定的控制功能例如控制页面背景图案和颜色。
二、HTML常用标记
换行标记<br/>
段落标记<p></p>
标题标记<h1~6> </h1-6>其中数字越小标题越大
居中标记<center> </center>
超链接标记<a href=""></a>
图片标记<img src>
<div></div>每段
<span></spam>不换行
文字列表标记：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<ul>
<li>手机数码</li>
<li>电脑办公</li>
<li>家居饰品</li>
</ul>
<ol>
<li>手机数码</li>
<li>电脑办公</li>
<li>家居饰品</li>
</ol>
</body>
</html>
表格标记：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1px" width="100%"><!--table具有很多属性width表示表格宽度，border用来设置表格的边框 align用来设置对齐方式 bgcolor用来设置背景色-->
<!--标题用<caption>..</caption>开头,可以设置对齐方式align垂直居中valign等-->
<!--表头以<th>..</th>进行标记可以设置对齐方式align，背景background，合并列来表示colspan和垂直居中valign来表示-->
<!--表格行标记<tr>..</tr>-->
<!--表格单元格标记用<td>..</td>-->
<!--表格标记中colspan是合并列，rowspan是合并列-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1" width="100%">
<tr>
<td colspan="2">1</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td rowspan="2">6</td>
<td>7</td>
<td colspan="2" rowspan="2">8</td>
<td>10</td>
</tr>
<tr>
<td>12</td>
<td>15</td>
</tr>
</table>
</body>
</html>
<tr><!---->
<th>姓名</th>
<th>数学</th>
<th>语文</th>
<th>总分</th>
</tr>
<tr>
<td>小明</td>
<td>100</td>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>小红</td>
<td>100</td>
<td>100</td>
<td>100</td>
</tr>
</table>
</body>
</html>
三、HTML表单标记
<form>..</form>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!--表单点击提交按钮，提交数据时
？参数列表
参数列表格式：
参数1=参数值1&参数2=参数值2&参数3=参数值3
on表示选中
？sex=on
单选框：用户只能选择不能输入要指定value属性,否则提交的都是on
文本框：用户可以自由输入不一定指定属性
-->
<form><!--其中form处理表单数据中的URL信息action处理表单中的URL地址，method数据传送到服务器的方式即get和post，其中get会将数据追加到acton后面，适合不需要保密的小量数据。post会将输入数据传送到服务器，适合大量数据name是表单名字 onsubmit用户提交表单后发生的事件-->
用户名：<input type="text" name="username" /> <br />
</strong>密码：<input type="password" name="password" value="123"/> <br />
性别：<input type="radio" name="sex" value="man" checked="checked"/>男
<input type="radio" name="sex" value="woman"/>女<!--表单输入标记可以向页面中添加单行文本。多行文本等按钮属性有：type添加的字段类型 disabled用于密码checked表示是否在被选中状态，其中的被勾选属性类型是checkedbox当属性是img的图片时src为图片来源alt表示图片无法显示时显示的文字，其中type的属性需要是image,value,当字段类型是checkbox或者radio(表单中的单选按钮)时不可以忽略value指定的是数据项选定的值当type是button reset或者submit指定的是按钮上显示的文字hidden是用户看不见的select表示下拉框<select>..<..select>其中mutiple表示是否可以多选，每一个选项是<option>..</option>-->
<!--多行文本标记-->
<!--<input type="radio" name="sex2" />公
<input type="radio" name="sex2" />母-->
<br />
<input type="submit">
</form>
</body>
</html>
<-----------------------我是分割线------------------------->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
用户ID：<input type="hidden"><br />
用户名：<input type="text" name="uname" /> <br />
姓名：<input type="text" name="uname" /> <br />
爱好：<input type="checkbox" name="hobby" value="code" checked="checked"/>阅读
<input type="checkbox" name="hobby" value="read"/>读书
<input type="checkbox" name="hobby" value="run"/>电影
<br />
照片：<input type="file" name="photo"/> <br />
<input type="submit" value="注册">
<input type="reset">
<input type="button" value="我是按钮">
</form>
</body>
</html>
扫一扫
2175
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
