如何仅对一页应用 CSS 样式更改?

2022-10-19前端开发问题
96

本文介绍了如何仅对一页应用 CSS 样式更改?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我有两个 css 文件:

I have two css files:

  1. 一个主文件(main.css)

  1. A main file (main.css)

一个特定的页面文件(page5.css).我的 page.css 包含 main.css (@import url(main.css));)

A specific page file (page5.css). My page.css contains main.css (@import url(main.css));)

我的 main.css 将其作为设置页面高度的一部分

My main.css has this as one part of it that sets the height of the page

#content {
    background:url(../images/image.png) no-repeat;
    width:154px;
    height:356px;
    clear:both;
}

这适用于所有其他页面,但在第 5 页,我需要更多的高度.

This works fine for all the other pages, but at page 5, I need a little bit more height.

我该怎么做呢?

推荐答案

你甚至不需要一个单独的 CSS 文件.您可以出于各种目的将类添加到您的正文中,识别页面或页面类型是其中之一.所以如果你有:

You don't even need a separate CSS file necessarily. You can add classes to your body for various purposes, identifying page or page type being one of them. So if you had:

<body class="page5">

然后你可以在你的 CSS 中应用:

Then in your CSS you could apply:

.page5 #content {
  height: XXXpx;
}

并且它只适用于该页面,只要它出现在您的主要 #content 定义之后.

And it would only apply to that page as long as it occurs after your main #content definition.

这篇关于如何仅对一页应用 CSS 样式更改?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

layui 单选框、复选框、下拉菜单不显示问题如何解决?
1. 如果是ajax嵌套了 页面, 请确保 只有最外层的页面引入了layui.css 和 layui.js ,内层页面 切记不要再次引入 2. 具体代码如下 layui.use(['form', 'upload'], function(){ var form = layui.form; form.render(); // 加入这一句});...
2024-11-09 前端开发问题
313

layui要如何改变时间日历布局大小?
问题描述 我想改变layui时间日历布局大小,这个要怎么操作呢? 解决办法 可以用css样式对时间日历进行重新布局,具体代码如下: !DOCTYPE htmlhtmlheadmeta charset="UTF-8"title/titlelink rel="stylesheet" href="../../layui/css/layui.css" /style#test-...
2024-10-24 前端开发问题
271

缩放背景图像以适合 ie8 窗口
Scale background image to fit ie8 window(缩放背景图像以适合 ie8 窗口)...
2024-04-19 前端开发问题
11

IE7 (IETEster) 中的@fontface 无法正常工作
@fontface in IE7 (IETEster) not working properly(IE7 (IETEster) 中的@fontface 无法正常工作)...
2024-04-19 前端开发问题
9

Safari 5.1 打破 CSS 表格单元格间距
Safari 5.1 breaks CSS table cell spacing(Safari 5.1 打破 CSS 表格单元格间距)...
2024-04-19 前端开发问题
3

如何使用 `on()` 委托 `hover()` 函数
How to delegate `hover()` function by using `on()`(如何使用 `on()` 委托 `hover()` 函数)...
2024-04-19 前端开发问题
17