标签:head javascrip password 标准模式 包含 记录 sof post 添加
HTML是一种超文本标记语言
标记是没有逻辑的
组成:
目的:完成页面的搭建
HTML页面大致的组成部分:
<!doctype html>
:必须出现在页面的最上方,规定该文档采用的html版本类型<html>:
页面标签:包含所有页面内容,只有head与body两个子标签<head>
:头标签:样式、脚本、后勤操作:页面编码、页面标签标题图标,主放功能<body>
:体标签:页面显示内容存放区域、样式、脚本,主放内容简单的一个htm5搭建:
<!DOCTYPE html>
<html lang="en"> <!--en会告诉浏览器内容为英文,中文为zh,若没有lang则浏览器会根据内容自己解析>
<head>
<meta charset="UTF-8"> <!--meta 为body里内容的编码的方式-->
<title>Title</title> <!--网页的标题-->
</head>
<body>
</body>
</html>
<!--注释内容-->
,还有一种不常用的注释写法<!-注释内容->
语法:&内容;
常用的转义字符
<: <
>: >
空格:
版权:©
? h1~h6:里面内容相对于普通的内容会加粗
,且会自动换行
? p:自带换行,有段落间距
? 共同点都不带换行
? 常用的文本类型标签
a标签
例如如下一句
<a href =‘http://www.baidu,com‘ targe = ‘_slef‘>页面中显示的文本内容</a>
http://
,https://
,file://
,前缀默认会在原来地址后面添加拼接成一个新的链接且超链接点击后会在浏览器上生成记录,显示文本颜色会变紫色
<img title="这是二哈" alt="二哈" src="url">
? ul>li:无序标签
? ol>li:有序标签
特殊的快捷键:ul>li{第$列}*5,其中$表示显示序列的位数
显示结果:
<ul>
<li>第1列</li>
<li>第2列</li>
<li>第3列</li>
<li>第4列</li>
<li>第5列</li>
</ul>
ul>li{第$$列}*5 显示结果
<ul>
<li>第01列</li>
<li>第02列</li>
<li>第03列</li>
<li>第04列</li>
<li>第05列</li>
</ul>
table>tr>th|td
属性
案例:
<table border="1" rules="all">
<tr>
<th>标题1</th>
<th>标题2</th>
<th>标题3</th>
</tr>
<tr>
<td rowspan="2">1</td>
<td colspan=2">2</td>
</tr>
<tr>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
from
>input
|label
|button
|textarea
|select
属性 | 值 | 含义 |
action | url | 指定一个表单处理目标URL,表单数据将被提交到该URL地址的处理程序。如果该属性值为空,则提交到文档自身。该属性值可以为绝对地址、相对地址、文档片段,甚至是脚本代码 |
method | get或post | 将表单数据提交到http服务器的方法,可能值有两个:get和post |
enctype | application/x-www-form-urlencoded | 指定表单数据的编码类型,此属性只有在method属性设置为post时才有效。默认值为application/x-www-form-urlencoded对所有字符进行编码。如果表单包含用于文件上传的控件(input type=“file”),那么这个属性值必须设为multipart/form-data ,不对字符进行编码。 |
input属性大概介绍:
案例分析:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单标签</title>
</head>
<body>
<!--1、form的作用:完成前后台数据的交互的 - 将用户录入的信息提交给后台 | 文件上传 -->
<form action="">
<p>
<!--label作为input的文本解释标签,for绑定id-->
<!--value属性是表单标签的内容,就是提交给后台的-->
<!--name是提交给后台的key,value是值-->
<!--placeholder是文本占位符-->
<!--type是决定标签的类型本质(input|button)-->
<!--multiple,checked布尔类型属性,不需要写值,multiple多选 checked默认激活-->
<label for="username">账号:</label>
<input id="username" type="text" value="Owen" name="usr">
</p>
<p>
<label for="password">密码:</label>
<input id="password" type="password" placeholder="请输入密码" name="pwd">
</p>
<p>
<input type="hidden" value="123asd{asdf2q1})sdf12" name="pk">
</p>
<p>
<input type="file" name="file" multiple>
</p>
<p>
男<input type="radio" value="male" name="sex" checked>
女<input type="radio" value="female" name="sex">
</p>
<p>
男<input type="checkbox" value="male" name="hobby" checked>
女<input type="checkbox" value="female" name="hobby" checked>
哇塞<input type="checkbox" value="other" name="hobby">
</p>
<p>
<button type="button">普通按钮</button>
<button type="reset">重置按钮</button>
<button type="submit">提交按钮</button>
</p>
<p>
<textarea cols="30" rows="10"></textarea>
</p>
<p>
<input type="button" value="按钮" />
<input type="reset" value="重置" />
<input type="submit" value=