HTML & CSS 到底是什么?有什么用?
HTML 和 CSS 是两门语言。 语言是什么呢?语言是沟通的工具 人与人之间沟通的语言:自然语言 人与计算机之间沟通的语言:计算机语言。可以理解为,人通过计算机语言与计算机进行“沟通”,并通过一些指令或者任务,让计算机完成人想要计算机完成的事情。 HTML: Hyper Text Markup Language 超文本标记语言。可以简单的理解为:定义网页中有什么 CSS: Cascading Style Sheets 层叠样式表。可以简单的理解为:定义网页中的东西长什么样子 目前,可以广义的理解为:HTML + CSS + JavaScript = 网页。即 HTML,CSS,JavaScript是开发网页的三大基础语言。
一些需要了解的标准术语
web
web是什么? web可以称为万维网,下面是对万维网的简单介绍,也可以称之为是对web的简单介绍: 万维网(英语:World Wide Web)亦作WWW、Web、全球广域网,是一个透过互联网访问的,由许多互相链接的超文本组成的信息系统。英国科学家蒂姆·伯纳斯-李于1989年发明了万维网。 万维网是信息时代发展的核心,也是数十亿人在互联网上进行交互和浏览器的主要工具。网页主要是文本文件格式化和超文本置标语言(HTML)。除了格式化文字之外,网页还可能包含图片、视频、声音和软件组件,这些组件会在用户的网页浏览器中呈现为多媒体内容的连贯页面。
注意⚠️: 万维网并不等同互联网,万维网只是互联网所能提供的服务其中之一,是靠着互联网运行的一项服务。 如果想对互联网做进一步了解,可以通过以下链接查看:https://zh.m.wikipedia.org/wiki/%E4%BA%92%E8%81%94%E7%BD%91
w3c
万维网联盟,一个非营利性组织,是万维网的主要国际标准组织,为半自治非政府组织
扩展: w3c官网:https://www.w3.org/
XML
可扩展的标记语言:extension markup language,用于定义文档结构的。
什么是HTML
HTML是W3C组织定义的语言标准:HTML是用于描述页面结构的语言。 HTML:Hyper Text Markup Language,超文本标记语言。 书写一个一级标题:
<pre data-language="html" id="7349dbee" class="ne-codeblock language-html" style="border: 1px solid #e8e8e8; border-radius: 2px; background: #f9f9f9; padding: 16px; font-size: 13px; color: #595959"><h1>这是一个1级标题</h1></pre>
扩展: HTML 参考官方文档:https://html.spec.whatwg.org/multipage/(全英版) 推荐MDN的官方文档,可以选择中文语言:https://developer.mozilla.org/zh-CN/docs/Web/HTML
什么是CSS
CSS是W3C定义的语言标准:CSS是用于描述页面展示的语言。 简单点来说,CSS决定了页面长什么样子。
CSS 参考官方文档:https://www.w3.org/TR/css-2021/(全英版本-最新版) 推荐MDN的官方文档:https://developer.mozilla.org/zh-CN/docs/Web/CSS
浏览器执行HTML、CSS
HTML、CSS -> 浏览器内核 -> 页面
浏览器的组成:
shell: 外壳
core: 内核(js执行引擎、渲染引擎)
市场上主流的浏览器及其内核:
IE: Trident(IE已经被微软宣布不在支持——2022年6月15日,微软宣布不再支持Internet Explorer) Firfox: Gecko Chrome: Webkit / Blink Safari: Webkit Opera: Presto / Blink
版本和兼容性:
HTML5、CSS3 HTML5:2014年 CSS3:目前还没有制定完成(CSS3标准已部分公布,但仍未全部制订完毕,还会有其它新内容继续加入。W3C网站上有专页展示CSS3发展的进展——CSS3发展过程报告)。 XHTML:可以认为是HTML的一种一个版本,完全符合XML的规范。
推荐使用开发工具和记录笔记工具
编辑器
Visual Studio Code(vs code): https://code.visualstudio.com/,微软出品的通用编辑器,支持大量插件扩展,支持自定义化等等(推荐)
WebStorm: https://www.jetbrains.com/zh-cn/webstorm/, jetbrains出品,很好用但略显笨重
Sublime: https://www.sublimetext.com/,曾经的前端开发主流工具,现在仍有大量开发人员使用,好用而且极其轻量
浏览器
Google Chrome: https://www.google.com/chrome/, Google出品的浏览器,对前端开发者有极其友好的调试工具,而且完全支持W3C标准。(推荐)
Edge:https://www.microsoft.com/en-us/edge?form=MA13FJ,微软出品的浏览器
......
记录笔记工具(文档编写器)
typora: https://typora.io/,支持markdown语法,而且轻量好用,页面美观等(推荐)
语雀: https://www.yuque.com/,支持markdown语法,支持知识库设置等(推荐)
扩展:
MDN:Mozilla Development Network,Mozilla开发者社区。 MDN里面的文档基本都是直接从W3C的官方文档翻译过来的,对应的中文字体基本没有错误,只有某些地方存在翻译错误 Markdown: 是一种轻量级标记语言,创始人为约翰·格鲁伯。它允许人们使用易读易写的纯文本格式编写文档,然后转换成有效的XHTML(或者HTML)文档。这种语言吸收了很多在电邮中已有的纯文本标记的特性。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,目前许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如GitHub、Reddit、Discord、Diaspora、Stack Exchange、OpenStreetMap 、SourceForge、简书等,甚至还能被用来撰写电子书。(简单的说,markdown语法不仅简单好用,而且使文档编写者不再花费大量时间关注样式,主要关注内容)