HTML基础与表单元素详解-优快云博客

本文链接：https://blog.youkuaiyun.com/pythonerxxs/article/details/78259909

表示本喵正在参加一个javaweb的培训，正好博客上啥内容也没有。就把笔记发一下。如有错误，请在评论里指出哈。

HTML超文本标记语言，没啥逻辑，记下标签就好了，w3school上有很好的教程，建议去看。

`基本标签：`

<!--我是注释-->
<!DOCTYPE html>
<!--声明这是html文档，对大小写不敏感-->
<html>
	<head>
		<meta charset="utf-8" />
		<!--声明编码为utf-8，避免显示中文乱码-->
		<title>我</title>
		<!--浏览器标签上显示的名称-->
	</head>
	<body>
		<h1>最大的标题</h1>
		<!--从大到小有h1到h6-->
		<p>比较小的内容</p>
		<!--p标签扩起来的是段落-->
		<img src="img/HBuilder.png" alt="图片没了" />
		<!--插入一张图片，src后面是图片路径，alt后面是当图片加载失败显示的文字-->
		<br><!--这个标签是换行-->
		<ul><!--无序列表Unodered List-->
			<li>呵呵</li>
			<li>哈哈</li>
		</ul>
		<ol><!--有序列表Odered List-->
			<li>怕不是个傻子</li>
			<li>吧</li>
		</ol>
		<dl><!--定义列表Define List-->
			<dt>标题1</dt>
			<dd>内容1</dd>
			<dt>标题2</dt>
			<dd>内容2</dd>
		</dl>
		<table border="10" cellspacing="0" cellpadding="10">
			<!--表格，border是边界线的宽度，cellspacing是单元格之间的距离，cellpadding是格子线和里面文字的距离-->
			<tr>
				<!--tr是一行,table row的意思-->
				<td>上午</td>
				<!--td是一个单元格，table data的意思-->
				<td rowspan="2">工作</td>
				<!--rowspan指这一格占两行-->
			</tr>
			<tr>
				<td>下午</td>
			</tr>
			<tr>
				<td colspan="2">晚上休息</td>
				<!--colspan指这一格占两列-->
			</tr>
		</table>
	</body>
</html>

表单标签：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<h1>新用户注册</h1>
		<form action="index.html">
			<!--表单标签，action后面是提交表单跳转的网址-->
			用户名：<input type="text" name="username" placeholder="不少于6位"/><br>
			<!--text文本框，name是值的键，方便服务器获取输入的值的，placeholder输入框中浅灰色的提示，输入文字后会消失-->
			邮箱：<input type="email" name="email" value="sss"/><br>
			<!--只能输入email格式的文本框，value输入框中的默认值-->
			密码：<input type="password" name="userpass" /><br>
			<!--密码输入会变点点-->
			确认密码：<input type="password" name="userpassagain" /><br>
			<select>
				<option>中国0086</option>
				<option>美国不知道</option>
			</select>
			<input type="tel" name="phone" placeholder="建议使用常用手机"/><br>
			<!--select下拉框-->
			性别：男<input type="radio" name="sex" value="man" checked="checked"/>
			      女<input type="radio" name="sex" value="woman"/><br>
			 <!--radio单选，注意name相同，如果不相同就变两个单选了-->
			爱好：看书<input type="checkbox" name="hobby"/>上网<input type="checkbox" name="hobby"/>看电影<input type="checkbox" name="hobby"/><br>
			<!--多选框，name也是相同的-->
			<input type="submit" value="提交"/>
			<!--提交按钮，value就是按钮显示的文字-->
			<input type="reset" value="清空" />
			<!--清空表单中所有输入-->
		</form>
	</body>
</html>

超链接：

<a href="http://www.baidu.cn" target="_blank">百度</a>

这个target设置成_blank就是在新标签页打开，设置成_self就是在本标签页打开

第一天 HTML基础教程

基本标签：

表单标签：

超链接：

`基本标签：`