从零开始前端学习[4]:关于html5文本文件的一些简单介绍

最新推荐文章于 2020-08-10 11:22:42 发布

^_^ 小小码nong

最新推荐文章于 2020-08-10 11:22:42 发布

阅读量556

点赞数 2

分类专栏： # 1.从零开始挑战前端文章标签： html5 标签 html5页面标签 html的格式前端格式

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/qq_29924041/article/details/78008477

版权

1.从零开始挑战前端专栏收录该内容

57 篇文章 3 订阅

订阅专栏

关于html文本文件的一些简单介绍

关于html文本文件中一些必要的标签定义

提示
博主：章飞_906285288
博客地址:http://blog.csdn.net/qq_29924041

html文本文件中一些必要的标签定义

html文件的声明

<!doctype html>

html文件的开头部分

既然是html文件，那么整个文本文件的应该就是以html开始，并且以html文件结束的,

<html></html>

在html标签内部主要分为两个部分，一个是head头部部分,一个是body体部

<html>
    <head></head>  //头部部分
    <body></body>  //体部部分
</html>

头部部分主要是一些对一些必要属性的声明，或者样式的设计，以及css或者js等链接

体部部分主要包括页面的一些布局，或者样式等设置，js等引用等也可以在体部做引用声明

在head标签中必须要声明语言类型，一般为 lang = “en”

<head lang="en">

</head>

头部文件中包含的必要的一些属性和对应的值

1:meta单标签:元素可提供相关页面的元信息（meta-information）

属性	值	描述
http-equiv	content-type expires refresh set-cookie	把content属性关联到HTTP的头部
name	author description keywords generator revised others	把content属性关联到一个名称
scheme	some_text	定义用于翻译content属性值的格式

在这里主要对name属性值进行解释

属性值	含义	使用方式
author	html的定义作者	<meta name=”author” content=”dean”/>
description	html文档主要的描述	<meta name=”description” content=”html文档的描述”/>
keywords	关键字	<meta name=”keywords” content=”关键字”/>
generator	编辑器的名称	<meta name=”generator” content=”webstorm”/>
revised	网页文档的修改时间	<meta name=”revised” content=”2017.09.17”/>

2:meta中的charset=”utf-8”

<meta charset="utf-8"/> //定义文档的编码类型

3：link单标签:link的单标签是用来进行外部链接使用的

属性	值	描述
href	url	规定被链接的文档的位置
hreflang	language-code	规定被链接的文档中文本语言
media	media-query	规定被链接文档被显示在什么设备上
rel	alternate author help icon licence next pingback stylesheet tag search prev	规定当前文档与被链接文档之间的关系
sizes	尺寸	规定被链接资源的尺寸，仅仅试用与rel=”icon”
type	MIME_TYPE	规定被链接文档的MIME类型

如下使用方式:

    <link rel="stylesheet" href="" />
    <link rel="shortcut icon" type="image/x-icon" href="" />

4：style双标签
style主要是用于内部样式的书写区域

<style>
    //css的样式
</style>

5:script标签：引入js，使用如下所示

<script src="./js/xxx.js"></script>

以上就是一些关于html文档中所包含的一些常用的标签和属性。

6:title标签：用来定义文档的名字的

<title>html网页名称</title>

    <!doctype html>
<html>
    <head lang="en">
        <meta charset="utf-8" />
        <title>templet</title>
        <meta name="Keywords" content="" />
        <meta name="Description" content="" />
        <link rel="stylesheet" href="" />
        <link rel="shortcut icon" type="image/x-icon" href="" />
        <!-- <base target="_blank" /> -->
        <style type="text/css">
            body,dl,dt,dd,p,h1,h2,h3,h4,h5,h6{margin:0;}
            ul,ol{margin:0;list-style:none;padding:0;}
            img{
                padding:0;border:0;margin:0;display:block;  <!--去掉默认的边框-->
            }
            a{text-decoration:none;color:inherit;}
            *{margin:0;padding:0;}
        </style>
    </head>
    <body>

    </body>
</html>