HTML常见标签介绍及使用

最新推荐文章于 2024-04-05 01:17:02 发布

张海玲

最新推荐文章于 2024-04-05 01:17:02 发布

阅读量577

点赞数

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

本文链接：https://blog.csdn.net/weixin_42014622/article/details/108952842

版权

html 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML标签01

<body>
	<input type="text" name="" value=" test">
	语文<input type="checkbox" name="">
	数学<input type="checkbox" name="">
	男生<input type="radio" name="sex">  <!-- name=sex 保证只能二选一 -->
	女生<input type="radio" name="sex">
	<input type="button" name="" value="登录">
</body>

在这里插入图片描述
结果显示

HTML标签02

<!--html 02-->
	<input type="file" name="">   <!-- 文件上传 -->
	<input type="password" name="">     <!-- 密码输入框 -->
	<!-- 下拉选择框 -->
	<select>
		<option>语文</option>
		<option>数学</option>
		<option>英语</option>
	</select>
	<!-- 超链接 -->
	<a href="http://www.baidu.com">百度</a>

在这里插入图片描述
结果显示

HTML标签03

<!--html 03-->
	<!-- 表格 -->
	<table>
		<tr><td>111</td><td>222</td></tr>
		<tr><td>333</td><td>444</td></tr>
		<tr><td>555</td><td>666</td></tr>
	</table>
	<!-- 图片 -->
	<img src="img\cat.jpg" width="400" height="200">

	<!-- 文本域 -->
	<textarea rows=" 5" cols="6"> </textarea>

结果显示
在这里插入图片描述

HTML标签04

<!--html 04-->
	<br>
	<b>测试</b> <!-- 加粗 -->
	<br>
	测试1<br>   <!-- br 换行 -->
	测试2<br>
	测试3<br>

	<p>这是段落</p>

结果显示
在这里插入图片描述

HTML标签05

在head里加入如下代码：

<style>
		.head{
			background-color: blue;
			color: white;
			text-align: center;
			padding: 5px; 
		}
		.left{
			line-height: 30px;
			background-color: #eeeeee;
			height: 300px;
			width: 100px;
			float: left;
			padding: 5px; 
		}
		.middle{
			width: 350px;
			float: left;
			padding: 10px; 
		}
		.foot{
			background-color: blue;
			color: white;
			clear: both;
			text-align: center;
			padding: 5px; 
		}
	</style>

在这里插入图片描述

<!--html 05-->
	<!-- 内嵌网页 -->
	<iframe src="http://www.baidu.com" width="600" height="600"></iframe><br>

	<div>
		<div class="head">
			<h1>页面顶部区域</h1>
		</div>
		<div class="left">
			<h1>页面左部区域</h1>
		</div>
		<div class="middle">
			<h1>页面中部区域</h1>
		</div>
		<div class="foot">
			<h1>页面底部区域</h1>
		</div>
	</div>

结果显示
在这里插入图片描述

张海玲

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML常见标签介绍及使用

HTML标签01<body> <input type="text" name="" value=" test"> 语文<input type="checkbox" name=""> 数学<input type="checkbox" name=""> 男生<input type="radio" name="sex">  女生<input type="radio" nam
复制链接

扫一扫