HTML基本标签（一）

最新推荐文章于 2024-08-16 22:57:43 发布

moonVivian

最新推荐文章于 2024-08-16 22:57:43 发布

阅读量270

点赞数

分类专栏： HTML 文章标签： html

本文链接：https://blog.csdn.net/HanQiuyue123/article/details/81571200

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一、HTML

<html>

<head>

</head>

<body>

</body>

</html>

说明：

<html>与</html>用来标记HTML文档的开始和结束

<head>与</head>用来标记HTML文档的头部开始和结束

<body>与</body>用来标记HTML文档的主体开始和结束

二、HTML标签

HTML标签指使用尖括号括起来的关键字，分为单标签和双标签
单标签：标签单独出现，语法：<标签名/>，比如<br/>。可以没有标签反斜线，即<br>也可以，但是这样不符合W3C规范
双标签：标签成对出现，语法：<标签名>内容</标签名>，比如<html></html>

三、HTML标签属性

HTML标签属性放在起始标签的尖括号内，如果有多个属性，则使用空格分开，语法结构：

单标签：<标签名属性名1="属性值1"　属性名2="属性值2" ... 属性名N="属性值N"/>，比如link标签中rel 、type和href属性

双标签：<标签名属性名1="属性值1"　属性名2="属性值2" ... 属性名N="属性值N">内容</标签名>，比如form标签action、method和enctype

注意：

1、属性之间使用空格间隔；

2、属性出现的先后顺序没有要求；

3、某些属性值可以不使用双引号引起来；但为了符合W3C标准，要求所有的属性值都使用双引号引起来；

四、实例：

此实例只是初次学习html时练习的一些标签，用法仅仅作为参考

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<form action="" method="">
			<!--隐藏框-->
			<input type="hidden" placeholder="隐藏" value="333333333333"/><br />
			
			<!--文本框-->
			<input name ="user_name" placeholder ="请输入用户名" value = "文本框" readonly = "readonly" disabled = "disabled"/><br />
			<input type ="password" placeholder="请输入密码" value="密码" /><br />
			
			<!--文本域-->
			<textarea name="summary" cols="50" rows="20"></textarea>
			
			<!--下拉列表-->
			<select name="grade">
				<option value="1">一年级</option>
				<option value="2">二年级</option>
				<option value="3">三年级</option>
				<option value="4" selected="selected">四年级</option>
			</select><br />
			
			<!--文件框-->
			<!--multiple用于可以选择多个文件（单文件要求在同一个文件夹下面）-->
			<input type="file" name="picture" multiple="multiple"/><br />
			
			<!--单选按钮-->
			<input type="radio" name="sex" value="0" id ="male"/><label for="male">男</label>
			<input type="radio" name="sex" value="1" id="female" /><label for="female">女</label><br />
			
			<!--复选框-->
			<input type="checkbox" name="hobby"  checked = "checked" value="0" id="lan" /><label for="lan">篮球</label>
			<input type="checkbox" name="hobby" value="1" id="zu" /><label for="zu">足球</label>
			<input type="checkbox" name="hobby" value="2" id="pp"/><label for="pp">乒乓球</label><br />
			
			<!--提交按钮-->
			<input type ="submit" value = "提交"/>
			<!--重置按钮-->
			<!--但是默认的值不会被重写消失-->
			<input type="reset" value="重写" />
		</form>
	</body>
</html>