以前学过的用来创建网页的超文本标记语言(HTML);
HTML是一种标记语言,使用标记标签来描述网页
构成HTML的基本元素:
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题
<p> 元素定义一个段落
在HTML标签(元素)中基本是成对出现的,含开始标签和结束标签,中间则是这个标签的作用比如:<p>p标签在HTML页面中显示的是段落的意思</p>;<h1></h1>-<h6></h6>标签来定义HTML的标题,标签中的数值越小,标题的字体越大,数值越大,字体越小;<br>换行;
<a href=“”></a> | 链接是通过标签 <a> 来定义的,href 属性中指定链接的地址 |
<img src=“”width=“”height=""/> | 图像是通过标签 <img> 来定义的,src指定图片的地址,width指定图片宽度,height指定图片高度 |
<hr> | 创建水平线,分隔内容 |
<b>,<en>,<i>,<small>,<strong>,<sub>,,<ins>,<del> | 定义粗体文本;定义着重文字;定义斜体字;定义小号字;定义加重语气;定义下标字;定义上标字;定义插入字;定义删除字 |
<abbr title></abbr> <acronym title></acronym> <bdo dir="rtl"></bdo> <q></q>
<pre></pre> | 代表实现缩写, 表首字母缩写;
文字从右到左显示; 短的引用 长的引用 pre 标签对空行和空格进行控制。 |
<button> | 定义一个按钮 |
<caption> | 定义表格的标题 |
<time datetime> | 规定日期/时间。另一种方式,则是由元素的内容给定日期/时间 |
form action | form创建供用户输入的 HTML 表单,action规定当提交表单时向何处发送表单数据 |
<div> | 定义 HTML 文档中的一个分隔区块或者一个区域部分。 |
input type | 标签规定了用户可以在其中输入数据的输入字段, <input> 元素在 <form> 元素中使用,用来声明允许用户输入数据的 input 控件。 输入字段可通过多种方式改变,取决于 type 属性 |
select | 来创建下拉列表。 |
<option> | 定义下拉列表中的一个选项 |
<optgroup> | 标签经常用于把相关的选项组合在一起 |
style | 规定元素的行内样式 |
有序列表 无序列表
<ul> <ol> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </ol>
HTML的自定义列表 <d1> <dt></dt> <dd></dd> <dt></dt> <dd></dd> |
html<base>元素:描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接 <base href="//www.runoob.com/images/" target="_blank">
<link> 标签定义了文档与外部资源之间的关系,通常用于链接到样式表
<link rel="stylesheet" type="text/css" href="mystyle.css">
<script>标签用于加载脚本文件;
HTML <div> 元素是块级元素,它可用于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。
如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性
HTML <span> 元素是内联元素,可用作文本的容器 当与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性 <p>我的有 <span style="color:blue;font-weight:bold">蓝色</span> 的眼睛
html创建表单和输入:用于收集不同类型的用户输入
<form>标签制作表单;
1.文本域;文本域通过<input type="text"> 标签来设定,当用户要在表单中键入字母、数字等内容
2.密码字段;密码字段通过标签<input type="password"> 来定义:
单选按钮:<input type="radio"> 标签定义了表单单选框选项
<input type="radio" name="sex" value="male"(表示单选的名字)>Male,
<input type="radio" name="sex" value="female">Female
复选框:<input type="checkbox">多重选择
<input type="checkbox" name="vehicle" value="Bike">I have a bike
<input type="checkbox" name="vehicle" value="Car">I have a car
下拉列表:<select name="">
<option ></option>
</select>
button创建按钮 <input type="button" value="Hello world!">
<legend></legend>带边框的表单 <legend>Personal information:</legend>
HTML脚本 :<script> 标签用于定义客户端脚本 最常用于图片操作、表单验证以及内容动态更新 <script> document.write("Hello World!") </script>
<noscript> 标签提供无法使用脚本时的替代内容,比方在浏览器禁用脚本时,或浏览器不支持客户端脚本,只有在浏览器不支持脚本或者禁用脚本时,才会显示 <noscript> 元素中的内容
事件响应
function myFunction(){document.getElementById("demo").innerHTML="Hello !"}
<button type="button" on\="myFunction()">点我</button>点击按钮后调用myfunction
HTML框架:通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面
iframe <iframe src="URL"></iframe> height 和 width 属性用来定义iframe标签的高度与宽度 <iframe src="demo_iframe.htm" width="200" height="200"></iframe>
去除iframe是否显示边框frameborder 属性
iframe src="demo_iframe.htm" width="200" height="200" frameborder="0">