<p>这是一段<span style="color: blue;">蓝色</span>的文字<span style="font-size: 20px;">（字号为20px）</span></p>

<nav>  <a href="index.html">首页</a>  <a href="about.html">关于</a>  <a href="contact.html">联系我们</a></nav>

<p>在这种情况下，<span class="highlight">强调</span>和<span class="highlight">重点</span>非常重要。</p><style>  .highlight {    background-color: yellow;    font-weight: bold;  }</style>

、

~

、

、
• 等等。

  块级元素常用于以下场景：

  2.1 布局和层次结构：块级元素非常适合用于布局和创建页面的层次结构。比如创建导航栏、侧边栏、页头、页脚等等。下面是一个示例代码：

  <header>  <h1>网页标题</h1>  <nav>    <ul>      <li><a href="index.html">首页</a></li>      <li><a href="about.html">关于</a></li>      <li><a href="contact.html">联系我们</a></li>    </ul>  </nav></header>

  2.2 列表和段落：块级元素可以用来创建有序列表和无序列表，以及段落等。下面是一个示例代码：

  <p>这是一个段落。</p><ul>  <li>列表项1</li>  <li>列表项2</li>  <li>列表项3</li></ul>

  2.3 容器和装饰性元素：块级元素可以用来创建容器和装饰性元素，比如盒子、分割线、区块等等。下面是一个示例代码：

  <div class="box">  <p>这是一个盒子</p></div><hr><section>  <h2>区块标题</h2>  <p>这是一个区块</p></section><style>  .box {    border: 1px solid black;    padding: 10px;  }</style>

  总结：行内元素和块级元素各自有着不同的应用场景，在编写HTML代码时，我们根据需求合理选择使用，以达到更好的网页展示效果和用户体验。希望本文能帮助大家更好地理解和应用HTML5中行内元素和块级元素的使用场景。