首页 > 其他分享> 文章详细

初识html

2020-10-20 03:00:35 阅读：142 来源： 互联网

标签：浏览器 color 标签初识 html 文档头部

html ：

HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的internet资源连接为一个逻辑整体。

HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等

<!DOCTYPE html>：声明

标准的html5网页声明，全称为Document Type HyperText Mark-up Language

声明文档类型为超文本标记语言或超文本链接标示语言，支持html5标准的主流

浏览器都认识这个声明，表示网页采用html5规范标准，声明位于最顶部，

此标签可告知浏览器文档使用那种规范，是html5还是xhtml

doctype不区分大小写以下几种方式均可：

<!DOCTYPE html>
<!DOCTYPE HTML>

<html></html>：web开始

<html>标签限定了文档的开始点与结束点，是页面元素的第一个标签

html标签是由尖括号括起来的通常都是成对出现的第一个是开始标签第二个是结束标签

<!DOCTYPE html>

<html>

</html>

<head></head>：web头部

head标签用于定义文档的头部，是所有头部元素的容器

head标签中的元素可以引用脚本，指示浏览器在哪里找到样式表，提供元信息等

文档的头部描述了文档的各种属性和信息，包括文档标题，在web中的位置以及和其他文档的关系等

绝大多数文档头部包含的数据都不会真正作为内容显示给读者

以下标签可以用在<head>标签部分

<!DOCTYPE html>

<html>
    <head>
        
    </head>
</html>

<body></body>：web主体

body标签定义文档的主体内容

body元素包含文档所有显示的内容例如文本，超链接，图像，表格和列表等

<!DOCTYPE html>

<html>
    <head>
        
    </head>

    <body>

    </body>
</html>

<meta charset="utf-8"> ：编码格式

使用在头部的标签

是一种字符编码，charset="utf-8"告知浏览器此页面属于什么字符编码格式，浏览器做好翻译工作

常见的字符集编码格式有：

gb2312：代表国家标准第2312条不包含繁体

gbk：国家标准扩展版

unicode：万国码

utf-8：unicode中的其中一种编码格式

<!DOCTYPE html>

<html>
    <head>
　　　　　<meta charset="utf8"/>
 　　　　　　
    </head>
</html>

<base></base>：默认链接

使用在头部的标签

base标签为页面上所有链接指定默认链接或默认目标

使用base标签后，浏览器将不在使用当前文档的url ，而使用指定url来解析所有文档中其他标签的url

这其中包括<a>，<img>，<link>，<form>标签中的url

下图a标签与img标签与base标签拼接成 https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1454783519,2870582753&fm=26

如果a标签的href与img的src属性没有值将指向https://ss0.bdstatic.com

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <base href="https://ss0.bdstatic.com" />
        <title>我是一个标题</title>
    </head>
    <body>
        <img src="/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1454783519,2870582753&fm=26"/>
        <a href="/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1454783519,2870582753&fm=26">陈一发</a>
    </body>
</html>

<title></title>:头部标题标签

使用在头部的标签

title元素可定义文档的标题，浏览器会把它显示在标题栏或状态栏上

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>我是一个标题</title>
    </head>
    <body>

    </body>
</html>

<script></script>:脚本标签

头部与主体都可以使用的标签

script用于定义客户端脚本，比如javascript

script元素既可以包含脚本语句,也可以通过src属性指向外部脚本文件，必须的type属性规定脚本的mime类型

常见的MIME类型：
　　超文本标记语言文本 .html,.html text/html
　　普通文本 .txt text/plain
　　RTF文本 .rtf application/rtf
　　GIF图形 .gif image/gif
　　JPEG图形 .jpeg,.jpg image/jpeg
　　au声音文件 .au audio/basic
　　MIDI音乐文件 mid,.midi audio/midi,audio/x-midi
　　RealAudio音乐文件 .ra, .ram audio/x-pn-realaudio
　　MPEG文件 .mpg,.mpeg video/mpeg
　　AVI文件 .avi video/x-msvideo
　　GZIP文件 .gz application/x-gzip
　　TAR文件 .tar application/x-tar

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>我是一个标题</title>
        <script type="text/javascript">document.write("<h1>我是一个js脚本</h1>")</script>
    </head>
    <body>
        <script type="text/javascript">document.write("<h1>我是一个js脚本</h1>")</script>
    </body>
</html>

<style></style>:样式风格标签

头部使用的标签

style标签为html文档定义样式信息

在style中可以规定在浏览器中如何呈现html文档

type属性是必须的，定义sty元素属性的内容唯一可能的值是text/css

text/css 是文本样式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <style type="text/css">
        h1{color: red;}
        p{color: blue;}
        a{color: black;}
        </style>
        <title>我是一个标题</title>
    </head>
    <body>
        <p>我是蓝色的</p>
        <a>我是黑色的</a>
        <h1>我是红色的</h1>
    </body>
</html>

<link></link>:外部资源标签

link标签定义文档与外部资源的关系

link标签最常见的用途是链接样式表

css/css1.css是在css目录下新建的一个.css文件

里面定义了p标签的背景样式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <style type="text/css">
        h1{color: red;}
        p{color: blue;}
        a{color: black;}
        </style>
        <link rel="stylesheet" type="text/css" href="css/css1.css"/>
        <title>我是一个标题</title>
    </head>
    <body>
        <p>我是蓝色的,但是背景是黄色的</p>
        <a>我是黑色的</a>
        <h1>我是红色的</h1>
    </body>
</html>

标签：浏览器,color,标签,初识,html,文档,头部
来源： https://www.cnblogs.com/dcszhangsir/p/13844238.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

初识html