在了解html之前,我们需要知道什么是html。
html是超文本标记语言,全称为HyperText Markup Language。
它是一种纯文本语言,只用于定义一个网页的结构和内容,而html定义的内容的样式是由css决定的。
- W3C
世界上第一个网页是Tim Berners-Lee(李爵士)写出来的,后来也是他建立W3C------万维网的主要国家标准组织,全称World Wide Web Consortium。
W3C只是给国际提出了一个推荐的网络标准(并不是强制要求),但它的出现还是给市场大部分网络技术解决了一些不兼容的问题,也保障了网络信息的顺利和完整流通。
- MDN
而对于前端开发者来说,MDN是一个相比较友好的学习网站。MDN的全称是MDN Web Docs(旧称Mozilla Developer Network),它是一个汇集众多Mozilla基金会产品和网络技术开发文档的免费网站。
- 最基本的HTML代码
<!DOCTYPE html>
<html>
<head>
<meta>
<title>标题出现在浏览器头部</title>
<style>
<!-- css外部样式 -->
</style>
</head>
<body>
<h>######</h>
<p>#####<a href="#" >#</a></p>
<img href="#">
<ul>
<li>#####</li>
<li>#####</li>
</ul>
<ol>
<li>#####</li>
</ol>
</body>
- 关于html的元素(标签)
在html的世界有一个词叫语义化,在程序中, 语义 指的是一段代码的含义,我的理解就是什么样的内容/结构就使用什么样的标签(元素),比较有意思的就是<i>
、<em>
、<b>
、<strong>
这几个标签。<i>
、<em>
这两个标签经浏览器解析出来表现的都是斜体的样式,而<b>
、<strong>
这两个标签表现出来的是加粗的样式。但是两个蕴含的语义确实截然不同。像<em>
为压力强调文字,<strong>
为重要文字,而<i>
、<b>
表示的更多是单纯样式,有更详细的解析在张鑫旭老师的博客里。
最后,关于html元素的学习,我觉得老师说的真的很有道理,要从实战中去学习。要带着做某一个页面或者项目的目的去学一个标签会让自己的印象来得更深刻,也会理解得更透彻。
- 关于空元素
空元素指的是html中不带内容的元素,这类元素通常不带闭合标签,也就是 不成双成对出现的,他们是自闭合标签(单身狗)。
在html中有以下空元素:
<img>
:表示文档中的一个图像。常用的属性有src
---图片的URL,alt
描述图像的替换文本,即是文本没加载出来时,会看到的文本提示。<base>
:指定用于一个文档中包含的所有相对URL的基本URL。一份中只能有一个<base>
元素。<br>
:在文本中产生一个换行(回车键)<col>
:定义表格中的列,并用于定义所有公共单元格上的公共语义。它通常位于<colgroup>
元素内<colgroup>
:HTML 中的 表格列组(Column Group<colgroup>
) 标签用来定义表中的一组列表<command>
:已经被废弃的标签。<embed>
:将外部内容嵌入文档中的指定位置。此内容由外部应用程序或其他交互式内容源(如浏览器插件)提供。<hr>
:段落级元素之间的主题转换。在可视化浏览器中表现为水平线。但目前被定义为语义上的,而不是表现层面上。<area>
: 在图片上定义一个热点区域,可以关联一个超链接。<area>
元素仅在<map>
元素内部使用。<input>
:用于为基于Web的表单创建交互式控件,以便接受来自用户的数据。<keygen>
:已经被废弃的标签。<link>
: 指定了外部资源与当前文档的关系. 这个元素的使用方法包括为导航定义关系框架.这个元素经常用来链接css文件。<meta>
:表示那些不能由其它HTML元相关元素(<base>
,<link>
,<script>
,<style>
,<title>
)之一表示的任何元数据信息<param>
:定义了<object>
的参数<source>
<track>
:被当作媒体元素—<audio>
和<video>
的子元素来使用。<wbr>
:一个文本中的位置,其中浏览器可以选择来换行,虽然它的换行规则可能不会在这里换行。
网友评论