CSS回顾总结(三)——HTML简介
发布日期:2021-06-30 16:35:17 浏览次数:3 分类:技术文章

本文共 3028 字,大约阅读时间需要 10 分钟。

目录


HTML:Hyper Text Markup Language

HTML就是超文本标记语言,标准通用标记语言下的一个应用。 “”就是指页面内可以包含、,甚至、等非文字元素。 超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

 

W3C:万维网联盟成立于1994年,是web技术领域最具权威和影响力的国际中立性技术标准机构。

HTML与XHTML区别

  1. xhtmI中标签名必须写;  在html中,不区分大小写
  2. xhtmI中属性名必须小写;    htmI属性名也必须是小写的
  3. xhtml中标签必须严格嵌套; html对 标签的嵌套没有严格的规定
  4. xhtmI中标签必须关闭; htmI中标签不闭合也是正确的,即可以不成对出现
  5. xhtml中空元素的标签页必须封闭,如<img!>,<br> ; htmI中没有要求
  6. xhtml中属性值必须用双引号引起来; htmI中 属性值可以不适用双引号
  7. xhtml中属性值必须使用完整形式,即k<input disabled="disabled">;  在html中可以采用简写,<inputdisabled>
  8. xhtml中,应该区分"内容标签和结构标签”比如<p>是内容标签,<table>是结构标签,不允许将table>置于<p>中,反之则可以将<p>置于<table>的<td></td>中
     

html写法规范

1.html中不区分大小写,但是我们一般都使用小写

2.html中的注释不能嵌套,注释里不能有注释
3.html中的标签必须结构完整,要么成对出现,要么自结束标签。
4.html的标签可以嵌套,但不能交叉嵌套
5.html标签中的属性必须有值,且值必须加引号

 

HTML网页的基本结构:

 

<!DOCTYPE html>

<!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前。

<!DOCTYPE> 声明不是一个 HTML 标签;它是用来告知 Web 浏览器页面使用了哪种 HTML 版本。

是html5标准网页声明,全称为Document Type HyperText Mark-up Language,意思为文档种类为超文本标记性语言或超文本链接标示语言,现在是这个简洁形式,支持html5标准的主流浏览器都认识这个声明。表示网页采用html5,<!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

 h5的文档声明,声明当前的网页是按照HTML5标准编写的 

    编写网页时一定要将H5的文档声明写在网页的最上边
    如果不写文档声明,则会导致有些浏览器进入一个怪异模式
    进入怪异模式后,浏览器解析页面时会导致页面无法正常显示,所以为了避免进入该模式,一定要写文档声明

HTML 4.01 与 HTML5之间的差异

HTML 4.01 规定了三种不同的 <!DOCTYPE> 声明,分别是:Strict、Transitional 和 Frameset。 HTML5 中仅规定了一种:

<!DOCTYPE html>

<html></html>

html根标签,一个页面中只有一个根标签,所有内容都应该写在根标签中

<head></head>

head标签中的内容不会再网页中直接显示,是用来帮助浏览器解析页面的

<title></title>

title网页的标题标签,默认会显示在浏览器的标题栏中

搜索引擎在搜索页面时,会首先检索title标签中的内容
它是网页中对于搜索引擎来说最重要的内容,会影响页面在搜索引擎中的排名

<body></body>

body标签用来设置主题内容,网页中所有可见的内容,都写在body中

<meta>标签

<meta> 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。meta还可以指定网页的描述,搜索引擎在检索页面时,会同时检索页面的关键词和描述,但这两个都不会影响网页在搜索引擎中的排名

使用meta标签可以用来设置网页的关键字,name是对content的一个描述

<meta> 标签位于文档的头部,不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。

需要告诉浏览器网页所采用的编码字符集

            meta标签用来设置网页的一些元数据,比如网页的字符集、简介、关键字
            meta是一个自结束标签,编写一个自结束标签时,可以在开始添加一个

使用meta可以用来做请求的重定向

                    比如:5秒以后跳转页面
                    <meta http-equiv="refresh" content="秒数;url=网页地址(目标路径)

 

HTML5标签分为常规标签和空标签两种

<常规标签>

<标签属性=“属性值”属性= “属性值”></标记>

空标签

      <标签属性=“属性值”1>

说明:

  • 写在<>中的第一个单词叫做标记,标签,元素。
  • 标记和属性用空格隔开,属性和属性值用等号连接,属性值必须放在“ ”号内。
  • 一个标记可以没有属性也可以有多个民性,属性和民性之间不分先后顺序。
  • 空标记没有结束标签,用“/”代替。

 

标题标签 <h1></h1>.......<h6></h6>

在显示效果上h1最大,h6最小

                使用html标签时关心的是标签的语义,我们使用的标签都是语义化标签
                6级标题中,h1最重要,表示一个网页的主要内容,h2-h6的重要性依次降低
                对于搜索引擎来说,h1的重要性仅次于title,搜索引擎检索完title,会立即查看h1中的内容
                h1会影响到页面在搜索引擎中排名,页面只能写一个
                一般页面中的标签只写h1,h2,h3

一级标签

一级标签

一级标签

一级标签

一级标签
一级标签

 

换行标签 <br />

在页面中可以用br标签来换行,br标签是一个自结束标签

段落标签 <p></p>

段落标签,用于表示内容中的一个自然段

                 使用p标签来表示一个段落
                 p标签中的文字默认独占一行,并且有行距

水平线标签<hr/>

hr标签是一条水平线,也是一个自结束标签

字体样式标签 加粗<strong></strong>   <b></b>

文字倾斜标签  <em></em>

特殊符号:     

  • &nbsp;     空格  在html中,字符之间写再多的空格,浏览器也会当成一个空格解析,换行也是一个空格
  • &gt;   大于号 >
  • &lt;      小于号 <
  • &quot;      引号 "
  • &copy;    版权符号 @

图像标签 <img />

链接标签   <a href="#" > </a>

页面间链接

一从一个页而链接到另外个页面

锚链接

使用name去做锚点,然后使用href="#name的名字"

  • 从A页面的甲位置讓转到A页面的乙位置
  • 从A页面的甲位置跳转到8页面的乙位置
  • 在目标标签中设置id属性一值        链按处href=" [路径]#值”
  • 设置<a nane="值”>目标处</a>,在链接处链接处href=”路径#值”

 

表格

优点:简单好用,结构稳定

基本结构:单元格,行,列

表格边框 border

表格对齐方式:默认对齐,居中对齐,左对齐,右对齐

单元格对齐方式:水平对齐方式,垂直对齐方式

 

 

一起学习,一起进步 -.- ,如有错误,可以发评论 

转载地址:https://kongchengji.blog.csdn.net/article/details/94349382 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:CSS回顾总结(四)——列表、属性选择器、文本标签、样式的继承
下一篇:微信小程序开发(四)——阿里矢量库的直接调用、swiper滑块

发表评论

最新留言

关注你微信了!
[***.104.42.241]2024年04月12日 14时39分05秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章