HTML5全部元素详解:一个都不能少

根元素

<html>

<html> 元素是 HTML 文档的根元素。

<!DOCTYPE html>
<html lang="en">
    <head>

    </head>
    <body>

    </body>
</html>

文档元数据

<head>

<head> 元素表示文档元数据的集合,是 <html> 元素的第一个子元素。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>

    </body>
</html>

<title>

<title> 元素代表文档的名字或标题。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name>
        <title>这是文档的标题</title>
    </head>
    <body>

    </body>
</html>

<base>

<base> 元素为文档中的所有链接指定基地址。如果URL中含有协议名或"//"则会忽略 <base> 指定的基地址。

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <base href="http://www.baidu.com/img/">
    </head>
    <body>
        <!-- http://www.baidu.com/img/a.jpg -->
        <img src="a.jpg">

        <!-- 如果带协议头,则忽略 base 指定的基URL -->
        <!-- http://www.baidu.com/img/b.jpg -->
        <img src="http://www.baidu.com/img/b.jpg">

        <!-- 省略协议头但保留"//",仍然会忽略 base 指定的基URL -->
        <!-- 这也是谷歌前端编码规范推荐使用的一种方式 -->
        <!-- http://www.baidu.com/img/c.jpg -->
        <img src="//www.baidu.com/img/c.jpg">
    </body>
</html>

<link>

<link> 元素为文档指定外部样式表。

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/style.css">
    </head>
    <body>

    </body>
</html>

<meta>

<meta> 元素提供文档的元信息,如文档编码、文档作者、文档描述等。

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <!-- 常用的几个 -->
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, user-scalable=no">
        <meta name="author" content="">
        <meta name="keywords" content="">
        <meta name="description" content="">
    </head>
    <body>

    </body>
</html>

style

<link> 是引入外部样式文件,而 <style> 元素则是在文档中写样式。

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            #div {
                width: 100px;
                height: 100px;
            }
        </style>
    </head>
    <body>

    </body>
</html>

每日更新中...

时间: 2024-10-29 19:05:48

HTML5全部元素详解:一个都不能少的相关文章

jqm的多列布局demo,html5的多列布局demo,多列布局的详细讲解,html5开发实例详解

由于移动设备屏幕宽度较小,所以一般不建议使用多列布局.但有时你可能需要并排放置一些元素(如按钮之类的). jQuery Mobile通过约定的类名ui-grid来提供了一种基于css的多列布局方法.共提供了五种布局方式,分别是:ui-gird-solo:单列布局,ui-gird-a:双列布局,ui-gird-b:三列布局,ui-gird-c:四列布局,ui-gird-d:五列布局.布局网格总宽度100%,完全不可见(无边框无背景),没有任何内边距或外边距,不会对网格中的内容产生任何干扰. 今天我

史上最全web.xml配置文件元素详解

一.web.xml配置文件常用元素及其意义预览 1 <web-app> 2 3 <!--定义了WEB应用的名字--> 4 <display-name></display-name> 5 6 <!--声明WEB应用的描述信息--> 7 <description></description> 8 9 <!--context-param元素声明应用范围内的初始化参数--> 10 <context-param&g

web.xml配置文件元素详解

一.web.xml配置文件常用元素及其意义 1 <web-app> 2 3 <!--定义了WEB应用的名字--> 4 <display-name></display-name> 5 6 <!--声明WEB应用的描述信息--> 7 <description></description> 8 9 <!--context-param元素声明应用范围内的初始化参数--> 10 <context-param>

web.xml配置文件元素详解(转载)

今天看到一篇关于web.xml配置文件元素的博文,觉得很全面,这里引用过来,方便学习和查询. http://www.cnblogs.com/hafiz/p/5715523.html 一.web.xml配置文件常用元素及其意义预览 1 <web-app> 2 3 <!--定义了WEB应用的名字--> 4 <display-name></display-name> 5 6 <!--声明WEB应用的描述信息--> 7 <description&g

玩转CSS3,嗨翻WEB前端,CSS3伪类元素详解/深入浅出[原创][5+3时代]

1.博客背景 在我的上一篇博客中, 很多园友提出说对css3"画图"不是很理解, 在跟他们私聊了一段时间以后,加上自己在开始自学css3的时候的疑惑,我觉得大家之所以不是很理解主要是因为对伪元素不太了解,介于画图和CSS3里一些高大上的特效用的比较广泛的伪类元素就是::before 和 ::after, 写这篇博客主要也是为了起到一个敲门砖的作用,所以本篇博客主要是讲::before 和 ::after.那么就让我们一起来聊聊伪元素吧. 2.CSS历史 伪元素实际上在CSS1(CSS1

HTML5之Viewport详解

做移动Web开发也有一年多的时间了,虽然手机上浏览器对于PC上来说很友好了,但是手机各种设备的显示尺寸分辨率大小不一也要花大心思兼容它们. 关于HTML5中Viewport的文章Google,百度一搜有很多.记录一些自己理解的内容: Viewport属性详解 Viewport:字面意思为视图窗口,在移动 web 开发中使用.表示将设备浏览器宽度虚拟成一个特定的值(或计算得出)这样利于移动 web 站点跨设备显示效果基本一致. 基础写法: <meta name="viewport"

HTML5 中的Nav元素详解

什么是Nav元素 Nav元素可以用作页面导航的链接组,在导航链接组里面有很多的链接,点击每个链接可以链接到其他页面或者当前页面的其他部分,并不是所有的链接组都要被放在nav元素里面,我们只需要把最主要的.基本的.重要的放在nav元素里面即可. 比如说页脚底部如果有个版权申明,我们就不建议使用nav元素,而是使用footer元素是最合适的.一个页面中我们可用多个nav元素作为整体或者不同部分的导航 nav元素的用法 <body> <h1>nav的使用方法</h1> <

HTML5新增的结构元素 详解

这篇文章我们不老生常谈的讲基础的HTML 就讲讲H5中新添加的一些知识 ?首先废话不多说 先来看看H5添加了那些新的结构元素 标签 说明 header 页面或页面中某一个区块的页眉,通常是一些引导和导航信息. nav 可以作为页面导航的链接组 section 页面中的一个内容区块,通常由内容及其标题组成 article 代表一个独立的.完整的相关内容块,可独立于页面其它内容使用 aside 非正文的内容,与页面的主要内容是分开的,被删除而不会影响到网页的内容 footer 页面或页面中某一个区块

html5的localstorage详解

HTML API localstorage在浏览器的API有两个:localStorage和sessionStorage,存在于window对象中:localStorage对应window.localStorage,sessionStorage对应window.sessionStorage.localStorage和sessionStorage的区别主要是在于其生存期. 基本使用方法 localStorage.setItem("b","isaac");//设置b为&