首页 / 知识

HTML5基础知识汇总

2023-04-11 13:57:00

HTML5基础知识汇总
　　开发工具：记事本等文本编辑器，Atom、VisualStudioCode（ VSCode）、Brackets、Sublime text和Hbuider。
 
　　浏览器：Chrome、Firefox、IE、Safari、IPhone、Android。
 
　　DOCTYPE  描述文档的类型
 
　　html     网页的根元素，写在网页的在外面
 
　　head    网页的头部信息，写在html标记的里面
 
　　body    网页的内容，写在html标记的里面
 
　　具体描述：
 
　　1、DOCTYPE  描述文档的类型，规定web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
 
　　网页可以使用的具体版本，网页中可以使用那些标记，每个版本的DTD版本均有不同
 
　　使用例子
 
　　HTML4的例子
 
　　HTML5的例子
 
　　2、<html></html> 网页文档中的根标记
 
　　html 标签有三个特殊的属性
 
　　manifest   指定网页缓存文件，可以让用户离线的时候也可以访问文件。
 
　　xmlns   设置html名空间，比如把网页设置成xhml的时候可以使用这个值。
 
　　lang   设置网页的描述语言，比如中文是zh；英文是en。
 
　　3、<head></head>头部标签在网页中只能有一个，设置HTML文档的头部信息，里面内容不会在页面中显示出来·。
 
　　head里面的标记
 
　　<meta> 标记
 
　　<title>定义网页的标题
 
　　<link> 链接
 
　　<script>  标记JavaScript脚本的内容
 
　　<style>  标记css样式
 
　　meta  标记
 
　　4、<body></body>只能有一个，显示网页的主体内容。
 
　　代码示例：
 
　　<meta>元素的属性：
 
　　name 描述信息的名称，来标记这是一个什么样的信息
 
　　http-equiv  描述行为
 
　　content  描述的内容
 
　　charset   指定网页的编码
 
　　1、name 属性
 
　　2、http-equiv属性
 
　　<meta http-equiv="refresh" content="5,url=dom.html">
 
　　http-equiv描述网页的行为，行为 refresh刷新，内容为5，表示5秒后跳转到 dom.html这个文档。
 
　　3、content 属性
 
　　特殊属性
 
　　content-type   指定http头部信息的文字编码（最为常用）
 
　　default-style   指定优先使用的样式单（stylesheet）
 
　　refresh    用于网页的自动刷新或是页面跳转
 
　　set-cookie   设置页面的cookie（现在已经不再推荐使用）
 
　　4、charset属性
 
　　指定网页的编码，推荐使用UTF-8来增加网页的兼容性。
 
　　代码实例：
 
　　为搜索引擎抓取机器人准备一些信息
 
　　这段代码可以禁止搜索引擎缓存和跟踪网页。
 
　　代码实例：
 
　　title和base标记都是写在head标签中
 
　　title：设置网页的标题
 
　　写法：<title>内容</title>。
 
　　base：指定网页跳转基准URL，如果不指定的话默认为当前网站的当前路径。
 
　　写法：<base href="">
 
　　base属性值：
 
　　href  指定网页跳转到基准URL，如果不指定的话则默认为当前网站的当前路径。
 
　　<base href="">  这是将页面跳转到百度的网站打开。
 
　　target  指定链接的跳转帧如果不指定的话，则是在当前页面中跳转。
 
　　<base target="_blank"> 网页中的链接都应该在新的窗口中打开。
 
　　terget属性值：
 
　　_blank  在新窗口中打开被链接的文档
 
　　_self   默认值，在相同框架中打开被链接的文档
 
　　_parent   在父框架集中
 
　　_top   在整个窗口中打开被链接文档·
 
　　framename   在指定框架中打开被链接文档
 
　　link标记：链接外部文件时使用的标记，可以把外部文件的内容引入到当前文件中来，使当前网页实现更多的功能。
 
　　link属性：
 
　　href：指定链接外部路径的路径和文件名，要设置全路径并且带文件名
 
　　rel：引用文件，引用资源的类型定义
 
　　我们在使用link标签引用外部文件的时候，外部文件的类型是多种多样的。
 
　　alternate   代替文档（种子，其他语言版本，其他格式等等）
 
　　author   网页的作者
 
　　help  帮助文件的链接
 
　　icon  网页的图标
 
　　next  如果是连续网页的时候，指定下一个网页
 
　　prefetch   把链接外部资源时提前缓存起来。
 
　　prev   如果是连续网页
 
　　media  链接文件或是资源属于哪一种资源。
 
　　hreflang   链接文件的语言种类
 
　　type  链接文件的mi/me类型（比如说，图片图标文本）
 
　　sizes  根据link链接文件的类型，来指定文件的大小
 
　　代码示例：
 
　　链接网页图标：
 
　　网站的图标指定，可以显示在浏览器的图标栏，也可以被手机读取作为网站的图标存入收藏夹
 
　　注意：后面的href和前面type标注的类型要一致，这样既可以显示在浏览器，又可以显示在手机上
 
　　链接外部样式单
 
　　说明：
 
　　alternate 会在浏览器中会弹出一个对话框，供用户可以进行选择
 
　　media  表示媒体类型为屏幕，可以是手机，但不包括打印机和投影仪
 
　　title  对这个link进行简单的说明
 
　　网站RSS种子指定
 
　　为搜索引擎的准备的网页的URL
 
　　告诉搜索引擎代替URL是哪里。

开发工具文本网页文档文本编辑器描述

最新内容

相关内容

热门文章

推荐文章

标签云

猜你喜欢