HTML基本用法
2017-12-29 17:11
295 查看
以下是HTML一些最基础的用法
都是一些简单的例子
方便查阅~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!-- 基本标签-->
<!-- 段落<p> 水平线<hr> 换行<br> 空格-->
<p>段落一</p>
<hr>
<p>段落二</p>
<hr>
你好<br>中国<br>
你好 中国
<!-- 标题代码-->
<h1>新闻</h1>
<h2>北京新闻</h2>
<h3>徐双双会玩滑板啦</h3>
<!-- 图像标签-->
<img src="images/peiqi.jpg" width="400px" height="336px">
<!-- 超链接-->
<a href="http://www.w3school.com.cn/" title="点击" target="_blank">进入w3School</a>
<!-- 有序列表和无序列表-->
<!-- 无序列表-->
<ul>
<li>小粉猪</li>
<li>丑丑</li>
<li>长鼻子小象</li>
</ul>
<!--有序列表 -->
<ol>
<li>小粉猪</li>
<li>丑丑</li>
<li>长鼻子小象</li>
</ol>
<!-- 表格 tr表示行 td表示列 tr里面只能放td 元素放在td标签里面-->
<!-- 属性介绍 bgcolor 背景颜色 cellpadding 内容与单元格之间的距离 cellspacing单元格与单元格之间的距离 border边框 align对齐--->
<table align="center" width="500px" bgcolor="#ff7f50" cellpadding="30px" cellspacing="10px" border="10px">
<tr>
<td bgcolor="aqua" align="center">单元格1</td>
<td bgcolor="aqua" align="center">单元格2</td>
<td bgcolor="aqua" align="center">单元格3</td>
</tr>
<tr>
<td>单元格4</td>
<td>单元格5</td>
<td>单元格6</td>
</tr>
</table>
<!-- 表单-->
<!-- 提交方法有get post 一般采用post方法提交-->
<form name="form1" action="value" method="post">
<table>
<tr>
<td>用户名：</td>
</tr>
<tr>
<td><input name="user_name" type="text"><!--input为单行文本输入框 type属性为固定的text--></td>
</tr>
<tr>
<td>密码：</td>
</tr>
<tr>
<td>
<input name="pass" type="password"><!-- type属性固定为password-->
</td>
</tr>
<!-- 单选框 type类型为radio 在一组中name相同 checked 默认为选中状态-->
<tr>
<td>
兴趣选择：篮球 <input name="d1" type="radio" value="0">
足球<input name="d1" type="radio" value="1">
排球<input name="d1" type="radio" value="2" checked>
</td>
</tr>
<!-- 复选框 type类型为checkbox-->
<tr>
<td>
选择城市：北京<input name="c1" type="checkbox" value="01">
上海：<input name="c2" type="checkbox" value="02">
泰安<input name="c3" type="checkbox" value="03">
</td>
</tr>
<!-- 下拉菜单 select+option selected为默认选项-->
<tr>
<td>
选择出生日期：
<select name="datenum">
<option value="01">2001</option>
<option value="02">2002</option>
<option value="03" selected>2003</option>
<option value="04">2004</option>
<option value="05">2005</option>
<option value="06">2006</option>
<option value="07">2007</option>
</select>
</td>
</tr>
<tr>
<td>
留言
<br>
<textarea name="book"
cols="20"
rows="10"></textarea>
<!-- 文件上传-->
<br>
文件上传：
<input type="file">
</td>
</tr>
<tr>
<td>
<input type="submit" value="注册">
<input type="reset" value="重填">
</td>
</tr>
</table>
</form>
</body>
</html>效果图：
都是一些简单的例子
方便查阅~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!-- 基本标签-->
<!-- 段落<p> 水平线<hr> 换行<br> 空格-->
<p>段落一</p>
<hr>
<p>段落二</p>
<hr>
你好<br>中国<br>
你好 中国
<!-- 标题代码-->
<h1>新闻</h1>
<h2>北京新闻</h2>
<h3>徐双双会玩滑板啦</h3>
<!-- 图像标签-->
<img src="images/peiqi.jpg" width="400px" height="336px">
<!-- 超链接-->
<a href="http://www.w3school.com.cn/" title="点击" target="_blank">进入w3School</a>
<!-- 有序列表和无序列表-->
<!-- 无序列表-->
<ul>
<li>小粉猪</li>
<li>丑丑</li>
<li>长鼻子小象</li>
</ul>
<!--有序列表 -->
<ol>
<li>小粉猪</li>
<li>丑丑</li>
<li>长鼻子小象</li>
</ol>
<!-- 表格 tr表示行 td表示列 tr里面只能放td 元素放在td标签里面-->
<!-- 属性介绍 bgcolor 背景颜色 cellpadding 内容与单元格之间的距离 cellspacing单元格与单元格之间的距离 border边框 align对齐--->
<table align="center" width="500px" bgcolor="#ff7f50" cellpadding="30px" cellspacing="10px" border="10px">
<tr>
<td bgcolor="aqua" align="center">单元格1</td>
<td bgcolor="aqua" align="center">单元格2</td>
<td bgcolor="aqua" align="center">单元格3</td>
</tr>
<tr>
<td>单元格4</td>
<td>单元格5</td>
<td>单元格6</td>
</tr>
</table>
<!-- 表单-->
<!-- 提交方法有get post 一般采用post方法提交-->
<form name="form1" action="value" method="post">
<table>
<tr>
<td>用户名：</td>
</tr>
<tr>
<td><input name="user_name" type="text"><!--input为单行文本输入框 type属性为固定的text--></td>
</tr>
<tr>
<td>密码：</td>
</tr>
<tr>
<td>
<input name="pass" type="password"><!-- type属性固定为password-->
</td>
</tr>
<!-- 单选框 type类型为radio 在一组中name相同 checked 默认为选中状态-->
<tr>
<td>
兴趣选择：篮球 <input name="d1" type="radio" value="0">
足球<input name="d1" type="radio" value="1">
排球<input name="d1" type="radio" value="2" checked>
</td>
</tr>
<!-- 复选框 type类型为checkbox-->
<tr>
<td>
选择城市：北京<input name="c1" type="checkbox" value="01">
上海：<input name="c2" type="checkbox" value="02">
泰安<input name="c3" type="checkbox" value="03">
</td>
</tr>
<!-- 下拉菜单 select+option selected为默认选项-->
<tr>
<td>
选择出生日期：
<select name="datenum">
<option value="01">2001</option>
<option value="02">2002</option>
<option value="03" selected>2003</option>
<option value="04">2004</option>
<option value="05">2005</option>
<option value="06">2006</option>
<option value="07">2007</option>
</select>
</td>
</tr>
<tr>
<td>
留言
<br>
<textarea name="book"
cols="20"
rows="10"></textarea>
<!-- 文件上传-->
<br>
文件上传：
<input type="file">
</td>
</tr>
<tr>
<td>
<input type="submit" value="注册">
<input type="reset" value="重填">
</td>
</tr>
</table>
</form>
</body>
</html>效果图：
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- html embed用法 Embed （一）、基本语法： embed src=url 说明：embed可以用来插入各种多媒体，格式可以是 Midi、Wav、AIFF、AU、MP3等
- html embed用法 Embed （一）、基本语法： embed src=url 说明：embed可以用来插入各种多媒体，格式可以是 Midi、Wav、AIFF、AU、MP3等
- HTML href 的基本用法
- day14 HTML 表单标签 CSS 基本的用法 CSS 高级用法--定位 CSS 中的基本单位 CSS 3 新特性
- 【html】html 的基本标签的用法
- html的下拉框的几个基本用法
- html的下拉框的几个基本用法
- HTML 基本用法及Apache搭建
- 一些自学的html代码（html中table基本用法）
- html:select 标签的基本用法
- html 基本用法
- html 基本用法
- HTML基本标签和用法
- html基本用法
- html 基本用法 概念
- HTML基本用法（一） · css将文字在一行中有序排列；
- html embed的基本用法
- Jsoup解析html的基本用法
- 第15节 html表格的基本结构、属性和用法
- NSIndexSet基本用法