如何将CSS仅应用于顶级元素

2024-04-18

在我的 HTML 中,我在单独的部分中有一些页脚元素,然后是该页面的一个全局页脚元素。我只想使全局页脚出现在视口的底部。

如果我这样做,它将影响所有页脚:

footer {
    position: fixed;
    bottom: 0px;    
}

如果我这样做,它会按预期工作,但是body语法看起来很尴尬:

body > footer {
    position: fixed;
    bottom: 0px;    
}

有没有更好的方法来仅指定顶级页脚?


将一个类添加到页脚并将 css 应用到该特定类。 正如其他人指出的那样,没有什么问题body > footer尽管。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将CSS仅应用于顶级元素 的相关文章

  • object.style.x 不返回任何内容[重复]

    这个问题在这里已经有答案了 在我网站上的 JavaScript 中 我有这样的内容 console log document getElementById side news style display 我已经尝试过很多样式 但它没有返回任
  • 如何允许点击穿过 div 但仍然对悬停做出反应?

    说我有divA部分重叠的divB 我怎样才能允许点击divA穿过去divB但仍然有hover悬停时触发divA 我知道pointer events none 这使得点击通过 但也阻止了悬停 我也尝试过以下方法 但它不允许点击失败 docum
  • 从第三方网站为 iframe 设置 CSS

    我正在尝试设计风格snapwidget Instagram feed http snapwidget com getstarted 我想让边框变成白色 这不是小部件的设置 所以我尝试添加 css 看来我的 css 没有被检测到 因为内容位于
  • iOS 中输入字段显示不同大小

    我有一个带有背景和固定宽度 高度的输入字段 它在我桌面上的所有浏览器中看起来都很好 但由于某种原因 它看起来更大iPad and iPhone 我在 CSS 中尝试了一些技巧 但到目前为止没有任何效果 width 120px importa
  • CSS3 媒体查询放在哪里?

    我正在与自己进行一场哲学辩论 讨论将媒体查询放在样式表中的最佳位置 我正在尝试模块化地构建我的CSS 例如OOCSS或SMACSS等 鉴于这种情况 我看到两个选择 将所有媒体查询放在单独的样式表或主样式表的一部分中 将媒体查询置于其基本对应
  • 表单输入不会采用百分比填充

    如果使用像素填充 我的表单输入会正确显示 但使用左侧和右侧的百分比填充会破坏它 我不明白为什么 它可以在 Safari 中运行 但在 Firefox 3 5 3 OSX 中损坏 问题是 当我使用百分比填充时 填充全部中断 因此输入值没有很好
  • 从三行菜单到十字菜单的动画变换

    我有一个三行动画菜单 当您单击它时 它会切换为十字 首先 您会看到三条线变成一条线 然后切换到十字线 但我想跳过从三行到一行的步骤 我怎样才能做到这一点 这是小提琴http jsfiddle net adyocsm9 http jsfidd
  • JQuery - 使用变量处理多个元素的一个处理程序

    我有两个这样定义的变量 var a a b b 如何使用 a 和 b 重写以下行 a b click function e a get 0 b get 0 click function e
  • 如何从左向右滑动文本和图像并具有滑动效果[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 浮动标签和占位符重叠

    div class form group form default form spacing div
  • 使用 css 变换在其父对象的宽度上对对象进行动画处理

    我正在尝试使用 css 转换来转换 100 宽度包装器内元素的位置来提高动画性能 因此 它从左侧进入屏幕并从右侧退出 然后重复动画 我想我可以在这个动画中使用百分比 我发现翻译与您正在制作动画的对象相关 因此 如果您有一个 100px 宽的
  • 半流体布局 CSS/Html

    我有一个两列布局 其中右列的静态宽度为 350px 左列的宽度应填充页面的其余部分 或者至少这是我想要发生的事情 但不幸的是事实并非如此 看一下我的 css html http jsfiddle net CmJ7P http jsfiddl
  • Xpath 获取 if href 包含字符串的一部分

    您好 我尝试获取包含 href p random tagged see 的所有元素 这是我的路线 div preceding h2 text Most recent div div a href p tagged see 我该如何修复此代码
  • 0 因为饱和度和亮度不起作用,但 0% 在 hsl/hsla 中起作用?

    我正在尝试一个简单的演示 其中我为元素赋予了颜色hsl 根据我的经验 我知道0CSS 中的 ZERO 是无单位的 如果要指定 0 作为值 可以保留单位 然而 情况似乎并非如此hsl hsla 在 Chrome 和 Firefox 上 结果都
  • 向 jQuery 函数 Interval 添加动画

    我的问题是如何向倒计时器添加一些动画 我的意思是每次调用 Function Interval 时都需要添加一些动画 如下所示 youtube 视频链接 https www youtube com watch v A9fnvhcWPRo 第二
  • 使用 jQuery / JavaScript 将 Alpha 通道添加到背景颜色

    我有一个 jQuery 函数 它添加了一个Alpha通道到一个背景颜色当事件发生时 这是我的jsFiddle http jsfiddle net liormb SxQt8 1 CSS div background color rgb 100
  • Firefox CSS 旋转与 Chrome 旋转不同

    我想制作一个 3D 矩形 平行六面体 用户可以用箭头移动它 它在 Chrome 中工作得很好 但在 Firefox 中 一些转换 实际上很多 与 Chrome 不同 看着this https jsfiddle net 7273yur9 2
  • 如何修复连接的可排序对象位置错误的可拖动助手(部分由浮动/相对定位的父元素引起)?

    Preface 我遇到一个问题 当使用放置在浮动 相对定位的父元素中的可拖动元素 可排序元素时 可拖动帮助器偏移不正确 浮动父元素是 Bootstrap 列 其中多个可排序列表放置在一列中 可拖动列表放置在另一列中 Example 这是一个
  • 我应该采取什么圆角方法?

    因此 关于圆角的信息并不缺乏 我已经经历过其中的大部分 我发帖是为了征求社区对这一点的意见 我的场景是 我们正在开发一个圆角相关设计 主要用于交互
  • 如何防止 Safari 滚动溢出:隐藏的 iframe?

    使用 Safari 您可以通过设置 style overflow hide 来禁用大多数 iframe 滚动 在 iframe 上 但是 如果您单击 iframe 并移动鼠标 内容无论如何都会滚动 Example 滚动内容 html

随机推荐

  • 安全移动 Microsoft SDK 文件夹

    我的硬盘上有一个文件夹 C Program Files Microsoft SDKs 我想知道将其移动到外部驱动器是否安全 Visual Studio 或任何其他工具是否依赖于此特定文件夹 注册表中有相当多的条目 至少在我的注册表中 指向该
  • Cython指定固定长度字符串的numpy数组

    我有一个函数 我想使用 Cython 来处理大量固定长度的字符串 对于标准 cython 函数 我可以像这样声明数组的类型 cpdef double g double in arr cdef double out arr np zeros
  • 对话框的对象位置 Libgdx

    我有一个对话框 Dialog dialog new Dialog style dialog setSize 400 500 dialog setPosition Gdx graphics getWidth 2 200 Gdx graphic
  • 使用自动 bash 脚本检查 FTP 中是否存在文件

    我想自动化执行以下操作的批处理作业 检查我的file txt存在于FTP服务器中 我将其重命名为file trt 检查我的file txt and file trt存在 如果存在我发送电子邮件 我运行另一个脚本 最后我删除file trt
  • Ruby+Anemone Web Crawler:正则表达式匹配以一系列数字结尾的 URL

    假设我正在尝试抓取一个网站并跳过一个像这样结束的页面 我目前正在 Ruby 中使用 Anemone gem 来构建爬虫 我正在使用skip links like方法 但我的模式似乎永远不匹配 我试图使其尽可能通用 因此它不依赖于子页面 而只
  • 为什么这个 Sql 语句(有 2 个表连接)需要 5 分钟才能完成?

    更新 下面添加了 3 个更新 以下sql语句需要5分钟才能完成 我只是 不 得到 它 第一个表有 6861534 行 第二个表少了一点 第三个表 包含 4 个地理字段 与第一个表相同 Those GEOGRAPHY第三个表中的字段 它们不应
  • 错误域=FIRFirestoreErrorDomain 代码=7“权限缺失或不足。”

    所以我有以下代码从 firestore 检索文档 该函数在我的 viewDidLoad 中调用 func loadAnnotations db collection jumpSpotAnnotations getDocuments quer
  • 将静态库链接到共享库

    我正在尝试在 Ubuntu Linux 上使用 g 5 4 0 创建共享库 我已经构建了 Poco C 库的静态库 a 文件 我想将它们静态链接到我的共享库中 但它不起作用 我已将以下字符串添加到我的构建脚本中 Wl whole archi
  • 如何使用c#读取EPS的属性或颜色信息?

    我的要求是读取另外50个EPS文件并导出EPS的属性 颜色模式 这可能吗 颜色模式有灰度 RGB 和 CMYK 到目前为止 我尝试使用 BitmapImage 来读取 EPS 但我没有运气 BitmapImage 不读取 EPS 因为它是矢
  • ANDROID:如何将视频文件下载到 SD 卡?

    我在网站上有一个 MP4 格式的视频文件 我希望用户能够通过单击链接将该视频下载到他们的 SD 卡上 是否有捷径可寻 我目前有这段代码 但它不起作用 不知道我做错了什么 谢谢你的帮助 import java io BufferedInput
  • Titan 加载弹性搜索问题

    我使用以下代码来加载泰坦 TitanFactory Builder config TitanFactory build config set storage backend berkeleyje config set storage dir
  • 指针的大小以及该大小是否取决于体系结构

    好吧 抱歉这个问题 更像是一个一般文化问题 尚未找到准确的答案 如果我有类似的东西 char Field or void Field or double pointers 指针的大小是一样的吗 据我记得大学时它是 4 个字节 但是 根据CP
  • 类型错误 - Python 中的类

    我是 Python 的初学者 刚刚开始掌握课程 我确信这可能是非常基本的东西 但为什么这段代码是这样的 class Television def init self print Welcome your TV self volume 10
  • 多个函数聚合的结果不可用于进一步计算。为什么?

    我对 R 中聚合函数的结果有疑问 我的目标是从数据集中选择某些鸟类并计算密度 调查区域内观察到的个体的数量 为此 我获取了主数据文件的子集 然后在区域上进行聚合 计算 平均值和个体数量 由向量长度表示 然后我想用计算出的平均面积和个体数量来
  • 异或数据包中的所有数据

    我需要一个可以根据用户输入计算校验和的小程序 不幸的是 我对校验和的了解只是它是数据包中所有数据的异或 我试图在网上搜索一个例子 但没有运气 我知道我是否有一个字符串 41 4D 02 41 21 04 02 02 00 00 00 00
  • 如何在 Android 上的 Camera2 API 中设置“CONTROL_AE_EXPOSURE_COMPENSATION”?

    我目前正在开发 Androids Camera 2 API 当前的问题是我无法设置 CONTROL AE EXPOSURE COMPENSATION 我的代码 1 0 public void setExposure double expos
  • 如何让 Spring 连接我的 JmsComponent

    我正在编写一个使用 Akka Akka Camel 和 Spring 进行配置的应用程序 应用程序需要充当针对各种应用程序服务器的独立 JMS 客户端 为此 它需要使用 JNDI 设置 JMS 连接工厂 我正在用 jBoss 测试这个 我对
  • 如何在 xsl 中检查字符串是否不区分大小写

    我有一个要求需要检查DB dbtype oracle 不区分大小写 我怎样才能做到这一点 这是我的代码
  • 使用 NX monorepo 的 Azure 管道有条件发布

    我们有一个 NX monorepo 里面有多个项目 并且正在使用 nx受影响来确定哪些项目已被触及 这对于我们的构建管道非常有效 但我们希望仅在项目实际发生更改时才发布它们 我们希望每个项目都有多个发布管道 只有在实际接触时才会触发 经过调
  • 如何将CSS仅应用于顶级元素

    在我的 HTML 中 我在单独的部分中有一些页脚元素 然后是该页面的一个全局页脚元素 我只想使全局页脚出现在视口的底部 如果我这样做 它将影响所有页脚 footer position fixed bottom 0px 如果我这样做 它会按预