HTML标题

标题是通过 h1 - h6 标签进行定义的。

<body>
    <h1>标题</h1>
    <h2>标题</h2>
    <h3>标题</h3>
    <h4>标题</h4>
    <h5>标题</h5>
    <h6>标题</h6>
</body>

效果如下，h1 定义最大的标题 h6 定义最小的标题

HTML 注释

格式

vsc快捷键ctrl+/（单行注释）或者shift+alt+a（多行注释） —————————————————————————————————————————————

HTML文本格式化

[b]	定义粗体文本
[em]	定义着重文字
[i]	定义斜体字
[small]	定义小号字
[strong]	定义加重语气
[sub]	定义下标字
[sup]	定义上标字
[ins]	定义插入字
[del]	定义删除字
————————————————————————————————————————————————

HTML超链接

HTML使用标签 a 来设置超文本链接。
"链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。
一条用来跳转到百度的超链接👇，href 属性描述了链接的目标

<a href="http://wwww.baidu.com"> 百度</a>

HTML 链接 - target 属性
使用 target 属性，你可以定义被链接的文档在何处显示。如果你将 target 属性设置为 "_blank", 链接将在新窗口打开。

 <a target="blank" href="http://wwww.baidu.com"> 百度</a>

HTML图像

HTML图像标签（img）和（src）

在HTML中图像有img标签来定义，src用于指向图像的url地址，alt中的文字一般只会在图像无法显示时显示

   <img src="图片地址*" alt="图像正在加载中">

图像标签可以用width和height来设置宽和高，但是只能设置一边，不然图片会变形

HTML列表

有序列表

有序列表是一个有项目的列表，列表项目使用数字进行标记

<ol>
        <li>咖啡</li>
        <li>牛奶</li>
        <li>碳酸</li>
    </ol>

效果👇

无序列表

无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。

 <ul>
        <li>咖啡</li>
        <li>牛奶</li>
        <li>碳酸</li>
    </ul>

效果👇

自定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。

<dl>
        <dt>咖啡</dt>
        <dd>- 黑又苦</dd>
        <dt>牛奶</dt>
        <dd>- 白又甜</dd>
    </dl>

效果👇

HTML内联元素和块元素

内联元素

HTML

和

内联元素在显示时通常不会以新行开始。

例子：b, td, a, img

块元素

大多数 HTML 元素被定义为块级元素或内联元素。

块级元素在浏览器显示时，通常会以新行来开始（和结束）。

例: h1, p, ul, table

块级与行内元素

块级：单独占一行，可以设置宽高
行内：只占据自己内容的范围无法设置宽高
行内→块级,display:block;块级→行内,display:inline

div和span

div是块级元素，它可用于组合其他 HTML 元素的容器。
span 元素是内联元素，可用作文本的容器

前端学习 Day1