HTML 2020.10.14

HTML概念

–HTML (Hypertext Markup Language):超文本标记语言。使用来制作网页的一种标记语言。

–HTML是一种纯文本格式的文件,内部只能书写文组内容,不能添加图片、音频、视频等,但是在网页中给用户呈现的效果却包含了文字以外 的内容,像这种效果就是HTML语言区别于其他文件的不同之处。

–HTML的重要概念有两个:一个是超文本一个是标记。超文本是超级文本的缩写,简单来说超文本就是用于链接另一个文本或多媒体内容的文本,比如链接到图片、链接、音频、视频、程序等。标记,又叫做标签(HTML Tag),有特殊的写法和规范,是写给浏览器的一种语法格式,结合普通的文字信息,实现特殊的语义或显示内容。在编辑器中可以编辑和查看,在浏览器中不显示。

–HTML的语义化 HTML文件中,如果没有使用特殊语义的标记,也可以实现网页显示效果,但是利用标记给普通的文本添加了不同的语义,能够让网站的结构划分更加清晰。语义化网页的优势:1.方便代码的阅读和后期维护2.便于浏览器或是网络爬虫更好地解析网站内容3.使用语义化标签有利于SEO搜索引擎优化,提高网站的搜索排名

HTML版本规范和标签语法

–HTML规范版本

W3C : world wide web consortium,万维网联盟。专门发布和维护互联网的规范和标准。

–HTML标签:

                    HTML标签通常被称为HTML标签(HTML Tag)。标签在书写和使用过程中,必须遵循特定的语法。

–HTML标签语法:

                             1. 标签名必须书写一对尖括号<>内部。  <html></html>

                             2.标签名分为但标签和双标签,双标签必须成对出现。                    

                            <p></p> 双标签           <br />单标签

                             3.双标签包含开始标签和结束标签,结束标签必须书写关闭符号/,单标签也需要进行自封闭书                             写。在HTML5中单标签可以不写关闭符号。 <br>

元素内容

1.元素内容 可以是纯文本,也可以是其他的HTML元素。这种元素内容包含其他HTML元素的情况,我们可以称为嵌套,也就是div标签元素内部嵌套了p标签元素。

div元素内部嵌套p元素

2.一个HTML元素div的内容可能是多个其他元素组成,例如p和h1,此时我们习惯称div是p和h1的父级元素,p和h1是div的子级元素,而p和h1属于同级元素,这种嵌套关系可以有多层。

                        <div>   <p> 拉钩教育</p> </div>

3.单标签是不能添加元素内容的,可以称为空元素。

– 标签级别

根据标签内部可以存放的内容不同,可以将双双标签划分为两个级别

容器级: 标签内部可以存放任意内容,包含容器级标签。比如h1,div等。

文本级:标签内部只能存放文本或类似文字的内容,比如存放图片、表单元素等。

–HTML元素特性

  1. 元素间对空格、换行、缩进等形成的空白不敏感,有无空白对在浏览器中加载的效果没有影响。浏览器识别的是元素的开始和借宿以及互相之间的嵌套关系。

段落内容

段落内容

段落内容

段落内容

段落内容

等价于 :

段落内容

                <p>段落内容</p>

2.空白折叠现象:元素内容如果是文本,所有文字(类似文字内容)之间如果有空格、换行、缩进等空白字符,在浏览器中加载时,链接在一起的空白会折叠成一个空格显示,这就是空白折叠现象。

HTML属性

HTML属性规范

1.书写位置 :必须写在开始标签或者单标签之内,与标签名之间用空格进行分隔。

2.属性包含:属性名(key)、属性值(value)。属性名与属性值之间的写法通常称做键值对写法,HTML标签属性的键值对写法是k=“v”。XHTML要求属性值必须在双引号内部。

         <p k="v"></p>

3.一个标签内可以设置多个不同的属性,属性与属性之间使用空格进行分割,每个属性的价值对写法都是 k=“v”

       <p k="v" k="v" k="v"></p>

4.部分标签属性k可以设置多个属性值v , 所有属性值v都必须卸载同一个双引号内,值与值之间需要使空格分隔。

        <p k="v1 v2 v3"> </p>

HTML的基本结构(基本骨架、DTD、命名空间、字符集)

–基本骨架

HTML文件最基本的四个标签,组成了网页的基本骨架,包括,,,

       <html>作用定义HTML文件的根元素,表示整个的HTML文档,所有的标签要书写在<html>内部

       <head>作用存放<title>,<meta>,<base>,<style>,<script>,<link>。内部用于对网页的设置,除了<title>内部的文字,其他标签都不显示在浏览器上。我们必须要设置的是title。

      <title>作用一:让羊肉面拥有一个属于自己的标题。作用二:title中的关键字可以作为搜索引擎抓取的关键字,提高SEO搜索引擎的优化。作用三:内部的内容会显示在搜索结果的标题部分。作用四:作为浏览器收藏夹默认的网页标题。

     <body>作用网页的主体部分,用于存放所有的HTML显示内容的标签。该内部的元素内容会显示在浏览器的窗口中。

–DTD

作用是告知浏览器该网页使用的是那个版本的HTML规范,让浏览器按照对应的版本HTML语法进行解析页面。

–命名空间

元素表示整个网页文档,在开始标签上设置了命名空间xmlns属性。

–字符集

标签内部的标签通过http-equiv属性定义了当前的网页所使用的字符变法charset

扩张

{国际通用字库

• UTF-8:以字节为单位对Unicode万国码进行编码,涵盖了所有人类的语言文字,一个汉字

为3个字节大小。

中文国标字库

• gb2312:共收入汉字6763个和包括拉丁字母、希腊字母、日文平假名及片假名字母、俄语

西里尔字母在内的682个。

• gbk:是gb2312的扩展,增加了繁体字,共收入 21886 个汉字和图形符号,其中汉字(包

括部首和构件)21003 个,图形符号 883 个,一个汉字为2个字节大小

}

字符集常见的问题1.如果没有网页加载速度要求,或者制作的是外文网站,使用utf-8.

2.如果含有大量中文汉字的网站,而且要求网页加载速度快使用gbk

1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值