4、语义化标签

最新推荐文章于 2022-05-14 13:16:53 发布

五仁卤鸡翅

最新推荐文章于 2022-05-14 13:16:53 发布

阅读量186

点赞数

分类专栏： css 文章标签： css css3

本文链接：https://blog.csdn.net/MoonNight608/article/details/106843074

版权

css 专栏收录该内容

50 篇文章 0 订阅

订阅专栏

文章目录

介绍
语义化标签
块、行内元素

介绍

本文是在学习CSS时做的学习笔记，所有笔记内容为 CSS学习笔记

语义化标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>meta</title>
</head>
<script>

</script>
<body>
<!--
 1、 h1标签重要性仅次于title标签
   页面中往往只有一个h1标签
   一般情况下，标题标签只会使用到 h1~h3,h4~h6很少用
   
   在页面中独占一行的元素为块元素（block element ）
      h1。。h6
      
   -->
   
<!--
 2、 p表示页面中一个段落，也是块元素
   -->   


3、hgroup 用于放标题组  块元素            
<hgroup>
  <h1>title1</h1>
  <h2>title2</h2>
</hgroup>   

4、em标签用于表示语音音调的加重,不会独占页面的一行元素，为行内元素
（inline element）
<p>天气<em>不错</em></p>

<strong><strong> 强调重要、加粗 

<blcokquote></blockquote> 引用、缩进效果 块元素

<q></q> 引用 行内元素

<br/> 换行

</body>
</html>

块、行内元素


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>meta</title>
</head>
<script>

</script>
<body>
<!--
 1、 块元素 （block element）
      --  在网页中通过块元素对元素进行布局
 2、  行内元素（inline element)
      -- 行内元素主要用来包裹文字
    
    -- 一般会在块元素中放行内元素，不会在行内元素放块元素
       块元素中基本什么都能放
       
    -- p元素中不能放任何块元素
 
 浏览器在解析网页时，会自动对不符合规范的内容进行修正 
    比如：
       标签写在了根元素的外部
       p元素中嵌套了根元素  
       根元素出现了除head body以外的元素   
   -->
   

</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>meta</title>
</head>
<script>

</script>
<body>
<!--
  布局标签（结构化标签）
  
  header 表示网页头部 也可以表示网页中某个部分的头部
  main 表示网页主体 页面只有一个
  footer 表示网页的底部  也可以表示网页中某个部分的底部
  
  nav 表示网页中导航
  aside 表示和我们主体相关其它内容（侧边栏）
  article 表示独立的文章
  section 表示一个独立的区块，上边的标签都不能表示时使用
  
  div  块元素  表示区块，还是主要的布局
  span 行内元素，没有任何语义，一般用于在网页中选中文字
  
   -->
 <header></header>
 <main></main>  
 <footer></footer>  
 
 <nav></nav>
 <aside></aside>
 <article></article>
 <section></section>
 
 <div></div>
 <span></span> 

</body>
</html>

五仁卤鸡翅

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
4、语义化标签

文章目录语义化标签块、行内元素语义化标签<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>meta</title></head><script></script><body><!-- 1、 h1标签重要性仅次于title标签页面中往往只有一个h1标签
复制链接

扫一扫