css - 如何使用 CSS 选择器在 h4 之后更改字体大小？

问题描述

这是我的代码，包含在代码段中，运行以查看 HTML 的外观：

<!DOCTYPE html>
<html lang="en-US">

<head>
  <title>Used Car Guide - Autoweekly on localhost</title>
</head>
<style>
  body {
    font-family: Verdana, sans-serif;
    font-size: 12px;
  }
  
  p {
    font-size: 12px;
    line-height: 18px;
  }
  
  h2 {
    page-break-after: always;
  }
  
  table {
    border: 1px solid black;
    width: 130%;
  }
  
  td,
  tr {
    font-family: Verdana, sans-serif;
    font-size: 12px;
    line-height: 14px;
  }
  
  div {
    width: 340px;
    height: auto;
  }
  
  div.news {
    width: 400px;
    height: auto;
    line-height: 22px;
  }
  
  div.news img {
    height: 221px;
    width: 347px;
    float: left;
  }
  
  div.autocarguide {
    width: 600px;
    height: auto;
    line-height: 30px;
  }
  
  div.autocarguide p {
    font-family: Verdana, sans-serif;
    font-size: 14px;
    line-height: 18px;
  }
  
  div.autocarguide h4>p {
    font-family: Verdana, sans-serif;
    font-size: 14px;
    line-height: 18px;
  }
  
  div.autocarguide tr,
  td {
    font-family: Arial, sans-serif;
    font-size: 15px;
  }
  
  div.autocarguide img {
    width: 430px;
    height: auto;
    margin: 20px;
    position: relative;
  }
  
  div.autocarguide img.auto {
    width: 320px;
    height: auto;
    margin: 20px;
    float: right;
    position: relative;
  }
</style>


<div class="autocarguide">
  <H2>Audi A8 sedan (2003-2010)</H2>
   <p><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/33/2003-2005_Audi_A8_%284E%29_4.2_quattro_sedan_%282011-01-05%29.jpg/420px-2003-2005_Audi_A8_%284E%29_4.2_quattro_sedan_%282011-01-05%29.jpg"></p>
  <p>Long a favorite full-size sedan of ours, the 2003-2010 generation of Audi A8 was one of our Car of the Year Runners-up, and a recommended car for 2007, 2008 and 2010. It's a worthwhile buy, especially in the L long-wheelbase models, which are well worth
    a test drive. However, the quattro sedan is awesome too, if you don't want a Range Rover, the <em>de facto</em> luxury choice for many, and want an all-weather full-size sedan.</p>
  <p>
    <h4>Performance</h4>
    We got a choice of three petrol engines; a 3.2-litre/252hp V6 engine, a 3.7-litre/276hp V8 engine, along with a 4.2-litre/335hp V8 petrol. These used Volkswagen-Audi Group's FSI technology gasoline-direct injection technology. They were badged aa 3.2
    FSI, 3.7 FSI and 4.2. Europeans got a wider range of engines, so no fuel-sipping 2.8-litre/207hp V6 or the later 3.0-litre/217hp V6 engines for us. The larger, faster V8, V10 and W12 FSI turbos wouldn't arrive until later.</p>
  <table>
    <tr>
      <td>3.2 FSI 4dr sedan</td>
      <td>6sp Automatic</td>
      <td>TBC</td>
    </tr>
    <tr>
      <td>3.7 FSI 4dr sedan</td>
      <td>6sp Automatic</td>
      <td>TBC</td>
    </tr>
    <tr>
      <td>4.2 FSI quattro 4dr sedan</td>
      <td>6spd Automatic</td>
      <td>TBC</td>
    </tr>
    <tr>
      <td>A8 L 3.7 FSI 4dr sedan</td>
      <td>6sp Automatic</td>
      <td>TBC</td>
    </tr>
    <tr>
      <td>A8 L 4.2 FSI quattro 4dr sedan</td>
      <td>6spd Automatic</td>
      <td>TBC</td>
    </tr>
  </table>
</div>

我想要做的是使标签后的文本成为 div 中的某种字体，但它没有工作，尽管 line-height 已经改变。

我的代码片段是我在http://127.0.0.1 、Mac OS Sierra 10.12.2、Mac mini 2011 上的 AMPPS 上运行的现有页面的示例，它是用于测试网站设计的纯 HTML。

我尝试了 h4+p，但没有成功，字体没有变化。我将它修改为 h4 > p 作为选择器，但同样，在 h4 元素之后字体大小没有真正的变化。

不过，作为 CSS 选择器的新手，我不确定我做错了什么。这是一个手工设计的页面，由我创建，所以它是使用我自己的基础知识进行的全新设计。

我会很感激任何帮助，因为我是 CSS 选择器的新手。

标签： csshtml

css - 如何使用 CSS 选择器在 h4 之后更改字体大小？

问题描述

解决方案

推荐阅读