返回

从零开始学前端

#知识库
#拓展知识
9%
进度
0/0
知识点
2
笔记
概述
1. HTML CSS 概念初识
1.1 HTML的基本认识
1.2 CSS 的基本认识
1.3 学习前的准备工作
2. HTML 基础入门
2.1 HTML 的语法认识
2.2 HTML 的框架标签
2.3 HTML 的内容标签
2.4 HTML 的布局标签
3. CSS样式表初识
3.1 CSS 的标准应用语法
3.2 CSS的引用方式
3.3 选择器的多种使用方法
3.4 CSS的盒模型认识
3.5 标签的宽和高尺寸
4. CSS 常用属性的应用规则
4.1 文字属性
4.2 色彩/图片属性
4.3 排版定位
4.4 动画效果
4.5 其它常见样式类型
5. 网站前端布局实例
5.1 HTML样式的语法
5.2 CSS 全局预设
5.3 顶部样式定义
5.4 内容样式定义
首页知识库知识库从零开始学前端

1.1 HTML的基本认识

UX百科编辑部 编辑于 2024-01-0527人正在学
20

HTML 也叫做超文本标记语言,是一种对内容进行结构化标记的工具。比如我们在一个 TXT 文档中,输入下面两行文字:

  • 超人的干货上新
  • 关于 HTML 和 CSS 入门详解

对于我们来讲,这两段文字的身份分别是 “标题” 和 “正文”,但对于电脑来说,它们都只是一系列文本而已。所以,我们需要赋予它们合法的 “身份”,让电脑可以正确对待他们。

而 HTML 的标签,就是赋予它们对应身份的铭牌,在 HTML 下的展示就会是这样,<h1>内是标题,<p>内是正文:

<h1>超人的干货上新</h1>

<p>关于HTML和CSS入门详解</p>

这和我们日常写作、笔记时使用的 Markdown 逻辑是非常近似的,只是语法上有一定的区别,且 HTML 提供了更多的功能,包括输入框、单选、多选、布局等类型的标签。

有了身份的标识,我们才可以使用 CSS 或者 JS 来对这些身份的人发号命令,这就是 HTML 最基本的作用。并且,HTML 还会通过标签的相互包含,来完成对内容层级结构的制定,我们会在后面具体展开讨论。

当然,HTML 代码需要在 HTML 文档中才能起作用,否则我们在 doc、txt 中写 HTML 代码和标签是没有意义的,这需要我们新建一个 txt 文件,将后缀改成 .html,来完成文档的创建。

之后,对它右键使用文本编辑器打开,就可以输入有关的代码内容了,比如:

  • <h1> Hello World!</h1>

输入完之后,再双击用浏览器打开这个文档,你就可以看见文字对应的显示效果了,这就是你的第一段代码,是不是特别容易?

点赞
收藏
学会
20252027
下一篇: 1.2 CSS 的基本认识
上一部分的案例中,Hello World 是一段黑色的标题,但我想修改它的大小、色彩、粗细、位置怎么办? 这就需要更改它对应的属性了,在最初,这种更改只需要用 HTML 的功能就可以完成,但效率实在是太低了(后面也会说),于是,分离出了 CSS 作为专门控制样式的替代品。 对于 HTML 的每一个标...
笔记 (0)
只看自己
logo
© 2023 uxbaike.com All rights reserved
版权声明意见反馈联系我们
weixinlogo
mx-auto
TOP
mx-auto
笔记
mx-auto
点赞