HTML##第一篇入门
HTML超文本标记语言,它是用来描述网页的一种语言
HTML不是一种,编程语言,而是一种标记语言
HTML是基本结构
基本结构#
网页
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>我的第一个网页<br/>
</body>
</html>
TAB +标签字母 秒变标签
br+bat=
网络的基本标签
标题标签
标题标签h中,等级越高字体越小加粗不变
标题标签都要在body标签;i
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>我的第一个网页<br/>
<h1>
。。。。
</h1>
</body>
</html>
换行标签
<br/
段落标签
...
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>我的第一个网页<br/>
<P>
我是大手笔
</P>
</body>
</html>
元素
块元素
无论内容多少,该元素独占一行 (lip,h1-h6……)
行内元素
内容撑开宽度,左右都是行内元素的可以排在一行(a,strong,em……)
水平线标签
默认整个网页
字体样式标签
……
斜体 …… 或者……
特殊符号
特殊符号 | 举例 | |
---|---|---|
空格 |  ; | <a hrer="#”>百度 ;| ; |
<a hrer="#”>新浪 | ||
大于号 | >; | 如果时间>;晚上6点,就坐车回家 |
小于号 | <; | 如果时间<;早上6点,就飞着上学 |
引号 | "; | W3C规范中,HTML的属性值必须用成对的";引起来 |
版权符号@ | ©; | "; 2003–2013 大傻逼学校 |
插入图片标签
<img 最重要src="图像地址"width="30PX"高单位px 宽height="50px"alt="图片加载不出来出现的文字"title="鼠标悬停提示文字"/>
链接标签
<a href="链接路径" target="_self或者_blank 判断新链接是否覆盖之前的窗口 "链接文本></a>
图片超链接
<a href="链接路径" target="_self覆盖或者_blank 判断新链接是否覆盖之前的窗口 "<img 最重要src="图像地址/"></a>
iframe网页嵌套网页
在一个网页嵌套一个网页
<iframe src="2.html"width="" height=""
列表分类
无序列表(重点)
声明无序列表<ui><li>文字</li>声明列表项
<li>文字</li>
<li>文字</li>
<li>文字</li>包含嵌套关系
</ui>
没有顺序没一个li标签都独占一行
有序列表
<ol>
<li>文字</li>
</ol>
定义列表的特性:
没有顺序,每个
标签、默认没有标记
一般用于一个标题下有一个或多个列表项的情况
有顺序i标签都独占一行 应用与试卷 排名
无序和有序标签下面只能包含li标签
常用的超链接
锚链接
从A页面的甲位置转达本文的乙位置
创建跳转链接甲位置
创建跳转标签
乙位置
表格的基本语法
<table border="1" align="center"
cellpading="20" cellspacing="2"
width="500" height="500">
<tr>
<td></td>
<td></td>
</tr>
</table>
border(显示表格) center中央 cellpadding 改变表格内间距
tr行标签 td列标签 colspan 标签里面的属性 在表格内是加粗
学生信息 |
colspan跨列
rowspan跨行
视频音频
<video src="视频路径" controls></video>
autoplay 马上播放视频/音频
controls 人工操作播放
height 播放器高度
loop 循环播放
preload 点击才播放
width 播放器的宽度s
muted 静音
.
元素名 | 描述 |
---|---|
header | 标题头部区域的内容(用于页面或者页面中的区域) |
footer | 标记脚步区域的内容(用于整个页面或者页面中的区域) |
section | Wed页面中的独立区域 |
article | 独立文章内容 |
aside | 相关内容或应用(常用于侧边栏) |
nav | 导航类辅助内容 |
表单
```html
<p><form action="01.html"method="get"></form></p>
<<input type="text" name="us"></p>
<p><input type="password" name="aw"></p>
<p><input type="submit"></p>
<p><input type="reset"></p>
action 表单提交位置 可以是网站或者是一个请求处理地址
method get post 提交方式
属性 | 说明 |
---|---|
type | 指定元素的类型。text文本框、password密码框、checkbox、radio、submit、reset、file、hidden、image和 button,默认为text |
name | 指定表单元素的名称 |
value | 元素的初始值。type为radio时必须指定一个值 |
size | 指定表单元素的初始宽度。当type为text 或password时,表单元素的大小以字符为单位。对于其他类型,宽度以像素为单位 |
maxlength | type为text或password时,输入的最大字符数 |
checked | type为radio或checkbox时,指定按钮是否是被选中 |
多行文本域
<textarea name="showText" cols="x" rows="y"> 文本内容</textarea>
一个中文字符等于两个英文字符
<textare name="showText" cols="x" rows="y"> 文本内容</texttarea>
<input name="gen" type="radio" valiue="男" checked />男
<input name="gen" type="radio" value="女" />
<input type="checkbox" name="interest" value="sports"/>运动
<input type="checkbox" name="interest" value="talk" checked/>聊天
<input type="checkbox" name="interest" value="play"/>玩游戏
<select name="列表名称" size="行数">
<option value="选项的值" selected="selected">...</option>
<option value="选项的值">...</option>
</select>
<inout type="reset" name="butReset" value="rese按钮"/>(重置按钮)
<inout type="sumit" name="butSubmit" value="subimit"/>(提交按钮)
<form action="#"method="post">
<p>
请输入网址:<input type="url" name="userUrl"/></p>
<input type="submit"/>
</p>
</form>
数字滚动<input type="number" name="num" min="0"max="数值" step="间隔数值"/>
<input type="submit"/>