HTML大总结(二)

简介: HTML大总结(二)

二、HTML常用标签 🔥


排版标签 : 主要和CSS 搭配使用,显示网页结构的标签,是网页布局最常用的标签。


  • 标题标签 <h>
  • 段落标签 <p>
  • 水平线标签 <hr/>
  • 换行标签<br/>
  • div 与span标签:没有语义,是我们用于网页布局的2个常用的盒子。


标签属性(行内式) :我们使用HTML制作网页时,如果想让HTML标签提供更多的信息,可以使用HTML标签的属性加以设置。


<标签名 属性1="属性值1" 属性2="属性值2" > 内容 </标签名>


1.标题标签


<body>
     <h1> 一级标题</h1>
     <h2> 二级标题</h2>
     <h3> 三级标题</h3>
     <h4> 四级标题</h4>
     <h5> 五级标题</h5>
     <h6> 六级标题</h6>
 </body>
  • 标题标签下的文字会变的加粗,字号也会根据标签等级依次变大,并且一个标题独占一行。


2.段落标签


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


  • 写在一个段落标签里的文字,会根据浏览器窗口的大小进行自动换行,并且段落和段落之间保有空隙。


3.换行标签与水平线标签


<br/>
 <hr/>
  • <br/>是个单标签,作用是进行换行,不会产生垂直的间距。
  • <hr/>自动生成一条100%宽的水平线。


4.盒子标签


  • <div></div> :一行只能放一个大盒子
  • <span></span> : 一行可以放多个小盒子
<div>这是一个div</div>
 <span>这是一个span</span>


5.文本格式化标签


  • 为文字设置粗体、斜体、下划线等效果
  • b和strong 文字以粗体显示
  • i和em 文字以斜体显示
  • s和del 文字以加删除线显示
  • u和ins 文字以加下划线显示


6.图像标签


<body>
     <img src="" alt="" title="" />
 </body>


  • src是<img>标签的必须属性,用来指定图像文件的路径与文件。


image.png


7.路径问题


在引入静态资源时(比如图片、音频等)需要通过文件路径进行引入,这里主要涉及到绝对路径与相对路径。


  • 绝对路径:是指目录下的绝对位置,直接到达目标位置,通常是从盘符开始的路径。
  • 相对路径:


image.png


相关文章
|
前端开发
|
Web App开发 Python
学习HTML笔记
学习HTML笔记
69 0
|
移动开发 HTML5
|
JavaScript 前端开发
|
开发框架 .NET PHP