常用H5标签-第二部分

最新推荐文章于 2024-05-13 16:58:25 发布

合肥辰辰

最新推荐文章于 2024-05-13 16:58:25 发布

阅读量535

点赞数 4

文章标签： html

本文链接：https://blog.csdn.net/Jingchennnn/article/details/127112140

版权

一、结构标签

1、header

header是网页的头部

2、main

main是网页的主体部分（一般就一个）

3、footer

footer是网页的底部

4、nav

nav是网页的导航

5、aside

aside是和主体相关的内容，侧边栏

6、article

aside是放置文章相关的内容

7、section

section是独立的区块，上面的标签都不合适，就用这个，一般用来代替div

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
 <body>
    <header>头部</header>
        <main>
          主体
          <nav></nav>
          <aside></aside>
          <article></article>
        </main>
        <footer>
          底部
          <section></section>
        </footer>
 </body>
</html>

二、行内与块元素

1、块元素（block element）

块元素常用来布局独占一行,自上而下一行一行的排列
常用块元素：div、p、h1-h6、ul、li、ol、header、footer、main、nav

2、行内元素（inline element）

行内元素不会独占一行,自左向右排列，一行满了，就挪到下一行，再自左向右
常用行内元素：span a i em strong del s
行内块元素
兼具行内元素，块元素特点
常用行内块元素：img

注意：
1、块元素是布局元素，里面什么都能放，能方块元素，能放行内元素，行内块元素
2、行内元素一般就用来包裹文字
3、特殊的块元素 p 不能放块元素
4、特殊的行内元素 a 里面什么都能放，除了它自己

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
 <body>
     <div>今天天气不错</div>
     <div>最低温度18度</div>
     <span>最高温度26度</span>
     <span>适合出去玩！</span>
 </body>
</html>

三、列表

1:有序列表

有序列表用ol标签创建，li表示列表项

2:无序列表

无序列表用ul标签创建，li表示列表项
（1）、disc，默认值，实心的圆点
（2）、square，实心的方块
（3）、ircle，空心的圆

3:定义列表

定义列表用dl标签创建，使用dd对内容进行解释说明

注意：

1.列表之间是可以互相嵌套的
2.可以使用type属性更改项目符号
3.默认样式，li有项目符号，上下外边距，左内边距

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
  <body>
    <ol type="i">
      <div></div>
      <li></li>
      <li></li>
    </ol>


    <ul>
      <li></li>
      <li></li>
      <li></li>
    </ul>

    <ul type="circle">
      <li>橙子</li>
      <li>橘子</li>
      <li>苹果</li>
    </ul>
    <dl>
      <dt>html</dt>
      <dd>html5</dd>
      <dd>css3</dd>
      <dd>less</dd>
      <dd>sass</dd>
      <dt>js</dt>
      <dd>js基础</dd>
      <dd>DOM</dd>
      <dd>Bom</dd>
    </dl>
  </body>
</html>

合肥辰辰

关注

4
点赞
踩
2

收藏

觉得还不错? 一键收藏
打赏
3
评论
常用H5标签-第二部分

一、结构标签1、header header是网页的头部2、main main是网页的主体部分（一般就一个）3、footerfooter是网页的底部4、nav nav是网页的导航5、aside aside是和主体相关的内容，侧边栏6、articleaside是放置文章相关的内容7、sectionsection是独立的区块，上面的标签都不合适，就用这个，一般用来代替div
复制链接

扫一扫