0
点赞
收藏
分享

微信扫一扫

【入坑前端第一天】—— 零散日记

像小强一样活着 2022-01-23 阅读 44
一、 前 序 \color{pink}{前序}

1.需要掌握的几个PS技能:

2.一个页面的标准组成:
Html CSS JavaScript —— 页面的结构、表现和行为
3.一些标签的含义:

<!DOCTYPE html>  【Html5的文档声明】
<html></html> 开始标签与结束标签(根元素)
*********************
<head></head> 页面的头部 【可以存放一些页面描述、作者信息等】
<meta charset = "UTF-8"> 页面的编码方式,此处选择的是支持中文的万国码
<tittle> 标题</tittle> 代表的是页面的标题
*********************
<body></body> 页面的主体

3.标签分为两种形式:封闭类型标签和非封闭类型标签(空标签)。【标签也可成为元素、标记】
4.对于一个元素可能存在多个属性,彼此之间用空格分开


二、 知 识 块 \color{blue}{知识块}

1. 标 题 \color{green}{标题}
HTML 标题(Heading)是通过<h1> - <h6>标签定义的。

<h1>这是一个标题</h1>
<h2>这是一个标题<h2>
<h3>这是一个标题<h3>

注意:(1)标题标签不可用于加粗字体。
(2)一级标题对应6号字体,六级标题对应1号字体。(一次类推)
(3)<hr>标签用于定义一条水平线
(4)<! -- ... -->标签用于定义注释内容

2. 段 落 \color{green}{段落}
HTML 段落是通过标签<p>来到定义的。

<p> 这是一个段落 </p>
<p>这是另一个段落</p>

注意:(1)利用<br>标签可以完成在一个段落内换行。

<p>这是<br />
一个换行<br />
演示段落</p>

(2)在HTML中所有连续的空格和空行都会被编译为一个空格。
3. 链 接 \color{green}{链接}
HTML 链接是通过标签<a>来定义的。

<a href = "https://www.bonbons.top"> 这是一个个人网站</a>

(1)这个标签中的 href 是它的一个属性,href 的属性值可以为任何有效文档的相对或绝对URL
(2)target  属性规定在何处打开链接文档

(3)id属性,可以在代码中起到标记作用,相对于读者是隐藏的。
注意:当单独使用 target = "_blank"时是不安全,要添加上 rel = “noopener noreferrer”.
4. 图 像 \color{green}{图像}
HTML 图像是通过标签<img>来定义的。

<img loading = "lazy" src = "/images/logo.png" width = "258" heigh = "39" />

loading 属性代表图片加载方式:

src 属性用于替换当前元素,此处后面的链接相当于图片的地址。
width 和 heigh 属性分别代表图片的宽度和高度。(属性值也为字符串的形式)
5. 空 元 素 \color{green}{空元素}
(1)没有内容的HTML元素成为空元素。
(2)例如换行标签<br>就是没有关闭标签的空元素,在开始标签的末尾添加反斜杠来关闭标签。
例如:<br />
(3)HTML 标签对于大小写问题不敏感,但是最好还是用小写。
6. 属 性 \color{green}{属性}
(1)对于大多的HTML标签都可以设置属性
(2)属性用于描述开始标签,为元素添加一些附加信息
(3)属性值应该包含在引号内,双引号比较常用,单引号也可以使用;针对于某些特殊情况只能使用双引号。
7. 文 本 格 式 化 \color{green}{文本格式化}
(1)HTML 使用标签<b> <i>对输出文本进行加粗、倾斜。
(2)这些标签也称为格式化标签。
(3)通常用<strong>标签代替加粗标签<b>
(4)通常用<em>标签代替倾斜标签 <i>
(5)文本格式化标签

(6)计算机输出标签

(7)引文,引用,及标签定义

举报

相关推荐

0 条评论