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

来源：互联网发布：易企秀电脑版 mac 编辑：程序博客网时间：2024/05/17 22:26

关于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>

欢迎访问博客

阅读全文

1 0