html学习——基础分类总结

Posted 2020-09-23

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html学习——基础分类总结相关的知识，希望对你有一定的参考价值。

超文本标记语言HyperText Markup Language。html文档基本结构：

<!DOCTYPE html>
<head>
    <!--放一些其它信息-->    
</head>
<body>
可见的页面内容
</body>
</html>

html用标记标签来描述网页，一个元素包含一对开始/结束标签。元素中可以设置属性，该属性在开始标签中以名称/值对形式出现

2. <head></head> 里面可以包含下面元素

<title>页面标题</title>	1.浏览器工具栏标题；2.收藏夹标题；3.搜索引擎结果页面的标题
<meta name="description" content="description">	元数据：数据的数据，对html数据进行说明的信息 1. name="属性name" content="属性对应的信息" 2. http-equiv="http头的属性" content="http-equiv相应属性信息"
<base href="http:www.xxx.com">	文档中的默认链接地址
<link rel="当前文档与被链接文档的关系" type="text/css" href="css文档地址.css">	文档和外部资源之间的关系
<style></style>	样式文件
<script></script>	客户端脚本文件

3. <body></body> 在页面中显示的内容

3.1 布局

3.2 文本结构

3.3 多媒体

<img src="图像地址" alt="显示不出图片时的文字">	插入图像
<img usemap="#mymap"> <map name="mymap"> <area shape="rect"> </map>	img利用map映射成一个可点击的图像 map配合area定义图像地图每个area是一个可点击的区域，跳转到外部链接
<canvas id="canvas_id"></canvas>	canvas是一个画布，用js在其中绘制2D图形	html5
<svg xmlns="xml命名空间地址"></svg>	svg是可伸缩矢量图形，利用xml格式定义图形	html5
<video width="" height="" controls> <source src="视频地址" type="video/mp4> </video>	插入一个视频	html5
<audio controls> <source src="音频地址" type="audio/mpeg"> </audio>	插入一个音频	html5
<object data="bookmark.swf"></object>	object用于插入对象，如java程序、视频、 flash播放器等。在Windows下被ie使用。	html插件
<embed src="bookmark.swf>	embed用于插入对象，如视频、flash播放器等。没有关闭标签！在Windows和Mac下被Netscape使用。两个tag作用相同，为了避免浏览器不兼容问题，使用<object><embed></object>	html插件

3.4 表单<form></form>

用于接收不同类型的用户输入，浏览器将用户在表单中输入的数据进行打包，提交表单时发到服务器

<form action="跳转到的地址"></form>
<input type="radio" name="a" value="b">	input是输入域 name: 用于js中引用 value：如作为元素中文本的默认值
<textarea></textarea>	多行的文本输入控件
<label for="inputID">inputID</label>	用for把label绑定到另一个元素，点击label文本时被绑定元素也会有相应响应
<fieldset> <legend>fieldset名字</legend> <input type="text"> </fieldset>	fieldset把一组相关的表单元素用外框包含起来 legend定义fieldset名字
<select> <optgroup label="optgroup1"> <option value="option1">option1</option> </optgroup> <optgroup label="optgroup2"> <option value="option1">option1</option> </optgroup> </select>	select定义下拉菜单 optgroup：多个option组成一组，组名会列出但不可选 option是菜单列表中的一项
<input list="listid"> <datalist id="listid"> <option value="a">a</option> <option value="b">b</option> </datalist>	datalist可用于指定<input> 元素可能的选项列表且可输入

3.5 全局属性&事件

全局属性：任何一个标签都是可以使用的属性
<p class="className1 className2"></p>	为<p>定义了两个类名
<p style=""></p>	定义元素的行内样式
<p id="pid"></p>	规定元素的唯一id
<p hidden="hidden">abc</p>	隐藏<p>元素
事件属性：触发浏览器中的行为	窗口事件、表单事件、键盘事件、鼠标事件及其它