CSS 选项卡边框问题

2024-04-13

我无法确定如何操作某些选项卡的边框

如果您已登录,您可以在 ASP.NET 上看到该功能http://forums.asp.net/user/editprofile.aspx# http://forums.asp.net/user/editprofile.aspx#

您可以看到,对于 onClick 事件,选项卡的背景颜色变为白色,就像它应该的那样。

我遇到的问题与 onClick 的边框有关:

底部边框应从灰色变为白色。 左边框和右边框应更改为灰色。

同样,当未选择选项卡时: 底部边框应从白色变为灰色。 border-left 和 border-right 不应有边框。

在我的 CSS 中,我为 JavaScript 使用了蓝色和白色类。但是我也有: .common-heading-tabs a.selected 这让我很困惑。

这是我的小提琴 - 如果有人能帮忙那就太好了http://jsfiddle.net/NinjaSk8ter/ZSeFA/ http://jsfiddle.net/NinjaSk8ter/ZSeFA/


我刚刚修改了 CSS 类.white有一点,你的 CSS 标记不符合标准:

border-left-color: #A0AFC3;
border-left-style: solid;
border-left-width: 1px;

此外,要使底部边框消失,您有两个选择之一,您可以执行以下任一操作

  • 删除底部边框.common-heading-tabs a类并将其添加到.blue class
  • add border-bottom-color:white !important; to the .white class

您看到这种行为的原因是因为标准选项卡有边框(来自.common-heading-tabs a),当您切换到白色时,您尝试更改颜色或某些边框,但您使用了border-left-color-value而不是简单地border-left-color,然后您没有修改白色类选项卡底部的边框,因此要么将底部边框声明移出.common-heading-tabs a或明确地着色bottom-border-color:white !important

希望有帮助!

Edit:

如果您要修改类,您请求在选项卡之间设置边框.left-col并添加到它:

.left-col
{
 border-bottom-color: black;
 border-bottom-width: 1px;
 border-bottom-style: solid;
}

这应该可以解决问题,也许你应该去掉其他选项卡上的边框,如果这是你正在寻找的,因为双边框看起来很时髦。

如果我可以提供更多帮助,请告诉我

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

CSS 选项卡边框问题 的相关文章

  • 如何修复“没有这样的文件或目录,lstat 'scss/'”?

    我正在尝试遵循 youtube 上的简单教程他尝试使用终端运行 npm 脚本 sass 文件 当我执行命令时npm 运行 sass显示错误消息错误 ENOENT 没有这样的文件或目录 lstat scss 我认为问题在于文件的路径或文件的权
  • 每 2 行后使 html 表格的边框变厚

    我创建了一个包含一些内容的表 其中有 12 行和 2 列 我想显示边框 但每 4 行之后 我想将水平边框设置为比正常情况更粗 怎么做 请在这里帮忙 试试这个选择器 table tr nth of type 4n td border bott
  • 理解 z-index:该元素如何出现在其父级同级元素的前面?

    为什么当我删除时红色 div 位于绿色 div 前面z index from wrapperRed 感觉像z index是沿着链条向上继承的 如果我改变z index将绿色 div 更改为 6 即使删除第一句中描述的行后 它仍保留在红色 d
  • 使用 python 在一个 html 页面中显示分割数据框的 HTML 代码

    我是 html css 新手 所以对以 html 格式显示的数据有疑问 我有一个很长的列表 我想将其拆分并以 html 格式显示为两个单独的列 例如 而不是 Col1 Col2 1 a 2 a 3 a 4 a 5 b 6 b 7 b 8 b
  • div 中的中心文本?

    我有一个div 30px高和500px宽的 这div可以包含两行文本 一行在一行 并相应地设置样式 填充 但有时它只包含一行 我希望它居中 这可能吗 要水平居中 请使用text align center 要垂直居中 只能使用vertical
  • Bootstrap:如何将按钮组对齐在中心(垂直)

    在下面的代码中
  • 如何在其他div id的悬停中使用div显示块

    如何打开div悬停时标记href tag 这是我在悬停 href 标签上显示 div 标签的代码 Services is id of href tag Services is id of div tag Service hover Serv
  • CSS 继承、别名和其他很酷的东西

    有一天 我随机浏览网页 发现了一些程序 可以让你编写 CSS 别名和其他很酷的东西 我现在不记得了 举个例子 我记得你可以这样做 myclass background color red greenfont 其中 greenfont 在其他
  • CSS 到底如何计算相对尺寸

    我想更好地理解某些 CSS 行为 这与具体问题无关 我只是在调试网站时遇到的 让我们在固定位置的 div 中放置一个全宽图像 div img style width 100 src https via placeholder com 150
  • 具有 100% 高度行和 Internet Explorer 9 的表格

    我有以下示例 div style height 150px background color AAAAFF div
  • css3按钮背景颜色无限过渡

    有没有办法仅使用 css3 使按钮的背景颜色从灰色渐变为蓝色 然后又回到灰色 一个很好的例子是默认操作按钮是可可 我知道这可以在 javascript 中完成 但我宁愿只使用 css 来完成此操作 您好 我已经通过 CSS3 动画制作了按钮
  • Chrome:当父级固定时,无法将一个绝对 div 放置在另一个 div 上

    我发现 当我想要位于顶部的 div 的父级固定时 我无法将一个绝对定位的 div 放置在 Chrome 中的另一个 div 上 div div div div div div 这是演示该问题的 JSFiddle http jsfiddle
  • 为什么我的列表项项目符号与浮动元素重叠

    我有一个 XHTML Strict 页面 我在其中将图像浮动在常规文本段落旁边 一切都很顺利 除非使用列表而不是段落 列表的项目符号与浮动图像重叠 更改列表或列表项的边距没有帮助 边距是从页面左侧开始计算的 但浮动会将列表项推到右侧insi
  • 当共享相同的行和列时,将网格项设置为不重叠

    现在 当两个网格项共享相同的行和列时 它们会相互重叠 div class some grid container div Item 1 div div Item 2 div div 我如何让它们不重叠 当共享相同的行和列时 其行为可能类似于
  • 有角度的动态背景图片

    在 html 模板中 我有这种带有动态图像的样式 div style background none width 200px height 150px div 它适用于网络浏览器和 Android 浏览器 但是 使用 style 的动态背景
  • 如何选择具有“A”类但不具有“B”类的 div?

    我有一些 div div class A Target div div class A B NotMyTarget div div class A C NotMyTarget div div class A D NotMyTarget di
  • 图像背景不透明度不影响边框

    如何设置背景不透明度而不影响边框线不透明度 我找到的解决方案没有帮助 div class selected img src assets img image product 1 thumbnail jpg alt product 1 thu
  • HTML 锚点,禁用样式

    我有一些 html 锚链接代码 与文档的其余部分不同 我希望它看起来不是链接 有没有一种简单的方法可以禁用由于将文本包装在锚标记中而引起的样式更改 而不必强行使其相同 即 如果我更改正文字体样式 我不必也更改其他一些 link东西 将颜色设
  • CSS溢出文本显示在几行中,没有断字

    我有一些长文本显示在 div 中 该 div 具有固定的宽度和高度 我希望文本显示在几行上 作为 div 高度 并且句子单词不会中断 一行中的单词前缀和下一行中的继续 此外 我想在末尾添加省略号最后一句话 CSS white space n
  • 在 Nexus 7 2013 上更改方向时 CSS 媒体查询不起作用

    我目前正在我的笔记本电脑 台式电脑和 Nexus 7 2013 上测试 CSS 媒体查询 除了 Nexus 7 之外 它们在台式机和笔记本电脑上都运行良好 当我更改方向时 除非刷新页面 否则样式不会应用 例如 以纵向模式握住设备时 页面正常

随机推荐

  • URL 重写 - 多个查询

    我想看看如何实现以下重写规则 From https localhost site page place place west https localhost site page location location cityname To h
  • 下载控制板软件模拟器

    我有兴趣学习如何用 c 进行嵌入式系统编程 但是 我需要一些硬件 我想知道有什么软件可以模拟控制板的功能吗 控制板在下面的教程中列出 http www learn c com hardware htm http www learn c co
  • 如何检查 db sqlite xamarin iOS 中是否存在表

    如何检查表的创建位置db数据库与否 var folder Environment GetFolderPath Environment SpecialFolder Personal SQLiteConnection db new SQLite
  • 如何在C++中创建地图函数?

    假设有一个整数列表 1 2 3 4 5 和一个映射函数 它将每个元素乘以 10 并返回修改后的列表为 10 20 30 40 50 而不修改原始列表列表 如何在 C 中有效地完成此操作 这是一个例子 include
  • 在 REBOL 中动态添加单词到上下文

    想象一下以下 REBOL 代码 foo context bar 3 我现在有一个上下文foo其中 bar被定义为 如何动态地将新单词注入到此上下文中 是否可以 我试过了 set any in foo baz 3 但这不起作用 因为表达式in
  • 时间:2019-03-17 标签:c#datetimeformat

    我希望根据当前的文化为我的日期时间设置特定的格式 所以我尝试这个 dateTime ToString dd MM yyyy hh mm 这部分是可以的 被特定于区域性的分隔符替换 但日和月的顺序不会根据文化而改变 如 MM dd Using
  • 将日期转换为Mysql日期格式php

    我的数据库中有这个日期格式 19th April 2013 我想将其转换为 2013 04 19 我已经使用了 if else 条件 但是它变得太长太复杂 有没有内置函数 Use PHP s date功能 date Y m d strtot
  • 基于“file:///C:/”的访问不允许 navigator.geolocation.getCurrentPosition [重复]

    这个问题在这里已经有答案了 可能的重复 Chrome 中的 HTML5 地理位置提示 https stackoverflow com questions 5423938 html 5 geo location prompt in chrom
  • 我可以实例化 std::reference_wrapper (其中 T 是不完整类型)吗?

    Does std reference wrapper
  • 为什么 [用户名].github.io 上的 GitHub 页面不会显示?

    我创建了 repo username github io 在 gh pages 分支中推送了第一次提交 等待了 30 分钟 GitHub 说 不应该超过 10 分钟 并在尝试加载我的页面时遇到 404 页面 用不同的浏览器查看 结果都是一样
  • 在 Mac App Store 的 Electron 应用程序中实现应用内购买

    我环顾四周 似乎有几个人遇到这个问题 但似乎没有人解决它 将 Apple 应用内购买添加到 Electron HTML JS 应用程序 https stackoverflow com questions 39841666 adding ap
  • OpenAPI V3 Maven Plugin使用multipart/form-data生成多文件上传的不完整接口代码

    我使用 Openapi V3 和 Maven 插件 openapi generator maven plugin 5 3 0 来使用 multipart form data 上传多个文件 但是 生成的接口代码不完整 在默认方法之一中缺少 L
  • 如何用通俗语言解释CSS Float?

    如何用通用语言 而不是编程 解释CSS Float 有没有现实生活中的例子可以举个例子来解释CSS Float 有没有以非常简单的方式解释浮动的幻灯片 就像听起来一样解释它 之所以称为 浮动 是因为元素像船一样 漂浮 考虑内容的其余部分是水
  • LINQ to SQL:存储过程结果

    如何更改 LINQ to SQL 设计器生成的存储过程结果的类名 除了弄乱 Designer cs 之外 另外 如何对存储过程的结果集执行 linq 查询 您可以在 dbml 中编辑它吗 就我个人而言 我倾向于将自动生成的类型 来自函数和存
  • 使用 Pandas 为来自多个 URL 的多个 CSV 文件创建一个数据框

    我想使用来自 URL 的多个 CSV 文件的 Pandas 创建 1 个数据框 结构 并保留初始标题行 使用单个 URL 一切都会按预期工作 df pd read csv http www URL1 csv 我已尝试使用多个 URL 进行以
  • JMeter 中的周期性后台任务

    我的测试计划中的请求使用授权令牌 我知道该令牌将在 1 小时内过期 我需要以某种方式每 59 分钟重新请求一次令牌 直到测试完成 有人可以建议最好的方法吗 看起来使用 While 控制器测试将永远不会完成并停留在永恒的 while 循环中
  • 在控制台中显示完整的 Git 提交消息

    我正在尝试在控制台中输出完整的提交消息 并且我能够获取该消息 但是为了查看完整的消息 我必须不断调整控制台窗口的大小以显示更多信息 我在 Windows 上使用 Cygwin 我正在使用的命令是git log pretty full 寻呼机
  • PHP 缺少 mb_strpos 函数?

    我收到此错误 PHP Fatal error Call to undefined function mb strpos in my file php 这很奇怪 因为mb strpos http us php net manual en fu
  • 使用 javascript 或 jquery 的几何(卷积)函数

    我尝试这样做 3 个月 我需要按路线方向创建一个多边形 如下所示 所以我写这个 directionService route request function result status if status google maps Dire
  • CSS 选项卡边框问题

    我无法确定如何操作某些选项卡的边框 如果您已登录 您可以在 ASP NET 上看到该功能http forums asp net user editprofile aspx http forums asp net user editprofi