在本站，我们已经看过很多关于如何通过代码修改网站或添加自定义功能的例子，而且通常CSS修改总是应用于整个网站或者应用于网站中的某些元素，像整个网站的链接、各种标题H等等。
如果我们只需要通过CSS进行样式更改，而这些更改只影响特定的页面，产品或文章，而不是整个网站，这该怎么做呢？
识别特定的页面
要对特定的页面应用CSS更改或其他修改，首先需要知道如何引用该页面，文章或产品。
基本上，你有两种简单的方法来识别页面：
- 在编辑页面里看URL。
- 查看页面的源代码。
1. 编辑界面查看URL
如果选择第一种方法，通过查看编辑时文章的URL来识别文章（帖子、产品等），只需注意地址中的数字，该数字出现在post=之后，这是文章的唯一ID。
- 页面:
- 如果是页面，ID格式为
page-id-192，192是我们查看到的页面ID。
- 如果是页面，ID格式为
- 文章、产品或其他内容:
- 如果是文章、产品或其他类型的内容，ID格式是
postid-192，192是我们查看到的文章或产品的ID。
- 如果是文章、产品或其他类型的内容，ID格式是
其实不需要进入编辑页面查看ID，更快的方法是直接在外面把鼠标放在页面名字上，左下角就会显示，如果是WooCommerce的产品，ID更是直接显示的。
/* 针对特定页面 */
.page-id-192 {
background-color: lightblue;
}
/* 针对特定产品或文章 */
.postid-192 {
font-size: 18px;
}
2. 查看页面代码
另外一种方式就是查看页面的代码来找出ID，只需右键点击页面，然后点击弹出菜单里的“查看页面源代码”选项。浏览器会打开一个新标签页，你需要在里面找你页面的ID，非常简单。
使用快捷键（Windows: Ctrl + F，Mac: Command + F）在源代码里搜<body，在<body>标签的同一行，你会找到ID。
/* 针对特定页面 */
.page-id-192 {
background-color: lightblue;
}
/* 针对特定产品或文章 */
.postid-192 {
font-size: 18px;
}
- 页面:
- 如果是页面，ID格式为
page-id-192，192是我们查看到的页面ID。
- 如果是页面，ID格式为
- 文章、产品或其他内容:
- 如果是文章、产品或其他类型的内容，ID格式是
postid-192，192是我们查看到的文章或产品的ID。
- 如果是文章、产品或其他类型的内容，ID格式是
给指定页面应用特定的CSS
现在我们已经知道如何找到特定页面或文章的ID，接下来就可以应用特定的CSS样式，让它只影响特定的文章或页面。
无论你选择哪种方法添加自定义代码，步骤都是相同的。你可以编辑子主题的CSS样式表，使用WordPress里的附加CSS或者通过代码插件来添加CSS。
/* 针对特定页面 */
.page-id-192 {
background-color: lightblue;
}
/* 针对特定产品，文章或其他 */
.postid-192 {
font-size: 18px;
}
上面的代码只会让ID192的页面背景颜色是lightblue，其他页面不发生任何改变。文章，产品或其他页面是192ID的字体大小是18px。
再次强调，除了页面的ID是page-id-192以外（page和id通过 “-” 分开），其他页面都是postid-192
为多个特定页面、产品或文章应用CSS
把同一CSS规则应用于多个页面，产品或文章，可以使用IDs，并用逗号分隔各个选择器。
/* 隐藏产品ID432和754的简短描述 */
.postid-432 .woocommerce-product-details__short-description,
.postid-754 .woocommerce-product-details__short-description {
display: none;
}
上面是一个示例，展示怎么对多个特定的产品隐藏简短描述。
