HTML简介

HyperText Markup Language 简称为HTML
HyperText: 超文本 （文本 + 图片 + 视频 + 音频 + 链接）
Markup Language: 标记语言
由SGML(标准通用标记语言)发展而来
写给浏览器的语言

HTML的基本结构

<html>

　　<head>

　　　　<title>我的第一个网页</title>

　　</head>

　　<body>

　　　　欢迎来到HTML世界

　　</body>

</html>

HTML标签元素

HTML元素由开始标签和结束标签组成。
位于开始标签和结束标签中的文本是元素的内容。
HTML 标签有开始必须有结束。如果是没有内容的标签（空标签），用 />来结束。
标签名推荐用小写。
标签具有属性， 属性用来表示标签的性质和特征。属性要在开始标签中指定。

定义一个合格的HTML页面

<!DOCTYPE html>

<html>

<head>

　　<meta charset="utf-8">

　　<title></title>

</head>

<body>

</body>

</html>

HTML常用元素

换行符  <br/>

段落  <p></p>

标题

<h1>标题1</h1>

<h2>标题2</h2>

<h3>标题3</h3>

<h4>标题4</h4>

<h5>标题5</h5>

<h6>标题6</h6>

文本格式化

<b>定义粗体文本</b>

<i> 定义斜体文本 </i>

<del>定义删除文本</del>

<sup>定义上标字</sup>

<sub>定义下标字</sub>

链接

<a href=“URL”>  </a>

锚点

锚点标签用于使用户"跳"到文档的某个部分。

<a href="#位置名">  </a>

<a name="位置名">  </a>

图像

<img src="URL" width="" height=""/>

图片相对地址的定义

同一目录

<img src=".jpg" />

下一层目录

<img src="data:images/.jpg"/>

上一层目录

<img src="../.jpg"/>

同一层不同目录

<img src="../images/.jpg"/>

图像热区

<img src="URL"  usemap="# map 名称" />

　　<map name="map 名称">

　　<area shape="形状" coords="坐标值" href="URL" />

</map>

HTML实体字符

实体字符 字符实体
大于号（>） &gt；
小于号（<） &lt;
引号（“） &quot;
注册商标（®） &reg;
版权（©） &copy;
&号 &smp;

无序列表

<ul>

<li>……</li>

<li>……</li>

<li>……</li>

</ul>

有序列表

<ol>

<li>……</li>

<li>……</li>

<li>……</li>

</ol>

HTML表格

<table border="1">

　　<tr>

　　　　<td>row 1, cell 1</td>

　　　　<td>row 1, cell 2</td>

　　</tr>

　　<tr>

　　　　<td>row 2, cell 1</td>

　　　　<td>row 2, cell 2</td>

　　</tr>

</table>

<iframe>内嵌框架

<iframe src="url" name="框架名"></iframe>

form（表单）

<form name="form1" action="URL" method="get">

　　用户名：<input type="text" name="">

　　密 码：<input type="password" name="passwd">

</form>
文本框

<input type="text" name="username" value="">

密码框

<input type="password"name="passwd">

单选按钮

<input type="radio"name="sex"value="1"checked="checked">男

<input type="radio"name="sex"value="0">女

checked是指默认选项，不需要可以不设置

复选框

<input type="checkbox"name="" value="">

<input type="checkbox"name="" value="">

<input type="checkbox"name="" value="">

按钮

<input type="submit" name="" value="提交">

<input type="reset" name="" value="重置">

按钮还可以用图片设置，使视觉性更好一点

<input type="image"name="" src="图片地址链接">

隐藏域

<form action="" method="post" enctype="multipart/form-data">

　　<input type="file" name="file">

</form>

textarea（表单元素：多行文本域）

<textarea rows="5" cols="50"></textarea>

select（表单元素：下拉框）

<label for="province">省份</label>

    <select id="province">

    <option>请选择</option>

    <option selected>广东</option>

    <option>上海</option>

 </select>

optgroup（表单元素：下拉框分组）

<select>

　　<optgroup label="热门城市">

　　　　<option>广州</option>

　　　　<option>深圳</option>

　　　　<option>上海</option>

　　</optgroup>

　　<optgroup label="其他城市">

　　　　<option>AAA</option>

　　　　<option>BBB</option>

　　　　<option>CCC</option>

　　</optgroup>

</select>

8.4 H5知识点总结的更多相关文章

  1. 第五课 CSS3 and H5 知识点

    概要:CSS3美化样式.自定义字体图标.滤镜设置.CSS3选择器.transform2D转换.新增表单控件.vaild表单验证.表单样式美化等. 属性选择器: E[attr]只使用属性名,但没有确定任 ...

  2. H5知识点

    一.总体变化 1.H5文档结构 <!DOCTYPE html> <html> <head> <title>  这是标题  </title> ...

  3. 000 (H5*) 知识点总结

    https://note.youdao.com/ynoteshare1/index.html?id=ff02e616917fba868f39241c8383d7c7&type=note 目录 ...

  4. H5移动端知识点总结

    H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开 ...

  5. 移动端H5的一些基本知识点总结

    移动端H5的一些基本知识点总结 来到这家公司之后,和曾经的工作发生了非常大的转变.曾经我一直是做PC端页面的.来到如今这家公司之后,主要是做手机移动端的页面. 移动端的页面在我这个做习惯了PC端页面的 ...

  6. H5+CSS3知识点

    概要:CSS3美化样式.自定义字体图标.滤镜设置.CSS3选择器.transform2D转换.新增表单控件.vaild表单验证.表单样式美化等. 属性选择器: E[attr]只使用属性名,但没有确定任 ...

  7. H5与APP混合开发相关知识点总结

    整理一: 现在有这么个需求,如下图 app端点击右上角的 加 号 ,弹出模态框 这个项目是基于vue写的,客户端需要调用H5页面里定义的js方法,但是在vue里,所有的方法都是在组件内部声明的,也只能 ...

  8. h5 的 audio 标签知识点

    因为音频格式有版权,各浏览器使用不同的音频格式. 音频格式兼容性 音频格式 Chrome Firefox IE9 Opera Safari MP3 支持 不支持 支持 不支持 支持 OGG 支持 支持 ...

  9. H5+CSS3简单动画 知识点 汇总

    乱入几个:  1.h5的一个语义化标签   figure :用于规定独立的流内容(图像 图表 照片 代码等)   figcapition:与figure配套使用,用于标签定义figure元素标题 2. ...

随机推荐

  1. Sublime Text 3安装插件指南

    Sublime Text已经很用得很广泛,一般普通的功能已经够用,加入一些插件能些许加快开发. 安装 Package Control 有了插件控制器Package Control安装起来就很轻松了. ...

  2. Sprint第二个冲刺（第九天）

    一.Sprint 计划会议: 现在简单说一下Sprint2的进展情况:大部分功能已经完成或者正在做,此次Sprint2中最难的设计商家的数据库表格已经完成了,剩下的其他功能都是比较耗时的,现在也在抓紧 ...

  3. iOS的URL处理

    前两天处理iOSapp过程中(我是用swift语言写的,资料较少),被一个“字符串”搞了一晚上的时间到第二天才处理好,在此记下,望见过此文的学生有一天遇到该情况能三分钟搞定不浪费时间: 先看如下代码 ...

  4. FlashFXP 破解代码

    FlashFXP RealKEY: ------------- 将以下内容COPY到软件里面的注册框即可 ------------- FLASHFXPwQAOlhkgwQAAAAC6W5MNJwTns ...

  5. codeForce-589D Boulevard（判断线段是否相交）

    题目大意:n个人.一个区间.每个人都会在某个时间段内按相同的速度(所有人的速度都一样,都是1或-1)在他的区间内从一个端点走到另一个端点(只走一次).问每个人会与几个人碰面. 题目分析:将时间看成一个 ...

  6. python编码-2

    字典 >>> aa={} >>> aa['wo']=[1,2,3,4] >>> aa['ni']=[5,6,7,8] >>> a ...

  7. 【C】 04 - 表达式和语句

    程序的生命力体现在它千变万化的行为,而再复杂的系统都是由最基本的语句组成的.C语句形式简单自由,但功能强大.从规范的角度学习C语法,一切显得简单而透彻,无需困扰于各种奇怪的语法. 1. 表达式(exp ...

  8. Alpha版本——Postmortem会议

    No Bug 031402401鲍亮 031402402曹鑫杰 031402403常松 031402412林淋 031402418汪培侨 031402426许秋鑫 设想和目标 1.我们的软件要解决什么 ...

  9. 报错：严重: Servlet.service() for servlet [jsp] in context with path [/20161116-Struts2-6] threw exception [/index.jsp (line: 13, column: 20) No tag "textfiled" defined in tag library imported with prefix

    严重: Servlet.service() for servlet [jsp] in context with path [/20161116-Struts2-6] threw exception [ ...

  10. 面对一个新的MCU，我再也不敢说第一步是点灯了

    折腾了几天AT91SAM3S,今天才算是把开发板上的3个LED点亮. 在点亮之前,起码看了百八十页的Datasheet,动用了N次百度. 各种时钟,看门狗,分散加载,中断向量,都得去整.这些都远远超过 ...