<!DOCTYPE html> <!--文档申明 H5 html-->
<html lang="en"> -->指定当前的html文件主要的语言是什么 en代表英文,zh-cn代表中文
<head> -->配置文件
<meta charset="UTF-8"> ->标签属性 格式:属性名称='属性值' 属性,用来规定标签的格式,效果等等
<title>Title</title> -->浏览器打开文件最上面显示的标签页
<meta name="keywords" content="30期皇家赌场,皇家赌场"> -->搜的是什么
<meta name="description" content="30期皇家赌场有好多视频"> -->对网站进行描述
</head>
<body> -->整个页面展示的内容,不单单可以写标签,还可以写文本,将需要渲染的放到里面★★★★★★
<h1></h1> -->标题标签,全封闭的标签 ,加粗
<img scr="" alt=""> -->半封闭(自封闭)标签 这个是用来展示图片的
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<s>删除</s>
<br> ==>用来换行 -->(自封闭)标签
<hr> ==>一条横线占一行,把两个标签分开 -->(自封闭)标签
<p>段落标签</p> -->自己在一行
<h1>标题1</h1> -->标题越来越小
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<div></div> -->独占一行
<span></span> -->所有的内容都在一行 如果竖着写 中间会有空格,不会独占一行
br标签换行上下没有间距,p标签是段落标签,独占一行且上下有间距
文本之间有很多换行和空格,都会被默认识别成一个空格,如果想多加空格,需要特殊字符空格符
div和span是一张白纸,没有带来任何的效果
html --标签 网页骨架
css--样式效果
js--动态效果
块级标签(行外标签,独占一行): p h1-h6 hr div
内联标签(行内标签,不独占一行); b i u s span img a
额外的还有br代表换行 列表标签( 无序ul 有序 ol) 表格标签table分为标题和内容两部分 input 标签 label标签 textarea标签 下拉框
标签可以嵌套,块级标签可以包含内联和块级某些标签,内联标签不能包含块级标签,他只能包含内联标签
div可以包含div,p标签比较特殊,不能包含块级标签,p标签也不能包含p标签(不能嵌套),可以试一下p标签套p标签,f12你会发现3个p标签
lk
</head>
<body>
<img src="图片路径" alt="这个一个葫芦娃" title="葫芦娃" width="100" height="100">
-->自封闭标签,图像显示标签,
-->src用来指定img要展示的图片在什么路径下(一般用相对路径),也就是显示图片的路径
-->src也可以指定远程路径引入
-->alt是指当图片加载出错,加载不出来的时候,显示文字,给用户做一些 提示
-->鼠标移动到图片显示一个葫芦娃
--->图片的高度和宽度是像素
--->width ,height 控制图片的高度和宽度,指像素
</body>
</html>
a标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>lk</title>
</head>
<body>
(1)
<a href="http://ww.baidu.com" target="_blank">百度</a>
-->超链接标签,可以跳转到某个网址(默认跳转是覆盖当前页面)
-->target="_blank"指定以一个新的页面跳转,不覆盖原来页面
-->href用来指定路径
(2)
<a name="xx">顶部位置</a> 或<div id="xx">顶部位置</div> -->埋点 (a标签的name属性,其他标签的id属性)
<a href="#xx">回到顶部</a> -->锚点
</body>
</html>
列表标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<ul type="disc">
<li>富强</li>
<li>小林</li>
<li>小琳琳</li>
</ul>
ul代表列表标签 li代表列表里的每一项
type里面代表的是空心圆还是实心圆
ul(列表标签)称为无序列标签
<ol start="2">
<li>小林</li>
<li>富强</li>
</ol>
ol代表有序列表,前面标记1,2,3..
start='2' 代表起始值为2
</body>
</html>
标题列表标签(了解)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<dl>
<dt>标题1</dt>
<dd>内容1</dd>
<dt>标题2</dt>
<dd>内容2</dd>
</dl>
dl代表标题列表
表格标签
<table border="1">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>爱好</th>
</tr>
</thead>
<tbody>
<tr>
<td>王</td>
<td>55</td>
<td>女人</td>
</tr>
<tr>
<td>刘</td>
<td>18</td>
<td>女人</td>
</tr>
<tr>
<td>富强</td>
<td>343</td>
<td>55</td>
</tr>
</tbody>
表格标签
thead -->标题部分
tr-->代表一行
th-->有一个加粗的效果,放的是标题
td-->代表的是一行的内容
border 边框
rowspan 竖着的合并
clospan 横着合并
input 标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action=""></form> -->放到from中才起作用
用户名:<input type="text">
密码: <input type="password">
<dir></dir>
爱好:
<input type="checkbox" name="hobby"> 男人
<input type="checkbox" name="hobby"> 女人
<input type="checkbox" name="hobby"> 男人
<br>
性别:
<input type="radio" name="sex"> 男
<input type="radio" name="sex">女
如果name值相同代表一组,在单选中只能选其中的一个,多选没影响
radio 单选 checkbox 多选
<hr>
<input type="submit" value="确定" >
submit 提交的效果 value把submit提交改为确定
<input type="reset">
reset 重置按钮
<input type="button" value="普通按钮">
button 普通按钮 需要指定一个值
<input type='hidden'>
hidden 隐藏标签
<input type="file">
文件选择框
label标签和textarea标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<label for="username">用户名</label>
<input id='username' type="text">
给input标签做标记用的
<textarea name="" id="" cols="10" rows="1"></textarea>
使用在评论上,多行文本输入框 cols一列是多少个 可以拉
</body>
</html>
Title
<select name="">
<option value="">男人</option>
<option value="">女人</option></select>
单选下拉框
<select name="multi">
<option value="">男人</option>
<option value="">女人</option>
</select>
多选下拉框