html - 将焦点应用于标记父级

标签 html css

<分区>

如何申请 input:focus然后 parent (div)更改边框颜色?

    div {
      width: 150px;
      height: 26px;
      border: 1px solid #ccc;
      background: white;
    }
    
    input {
      outline: none;
      border: none;
    }
    <div>
      <input type="text" />
    </div>

和 div 必须有 border: 1px solid blue;如果<input>专注。

jsFiddle

最佳答案

不幸的是,目前 CSS 中没有“父”标签选择器 - 请在此处查看此答案:Is there a CSS parent selector?

当您的 input 处于焦点时,显式更改父级 div 的 CSS 的唯一方法是使用 JavaScript。

如果您能够在您的解决方案中使用 JavaScript,我可以提供一个示例。

关于html - 将焦点应用于标记父级,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34178551/

上一篇:c# - 分页只是跳过一行

下一篇:javascript - 如何使容器 div "pointer-events:none"但内容可点击...?

相关文章:

html - 谷歌字体 URL 破坏 w3.org 上的 HTML5 验证

javascript - 如何阻止按钮上的动画影响按钮的悬停或一般功能

javascript - 不使用 jquery 将 UL LI 转换为 Accordion

css - 什么是 HTML5 等同于表格单元格中的对齐属性?

javascript - 在转到另一个选项卡时让 Twitter Bootstrap 选项卡保持原位

javascript - pugjs (jade 模板) - 删除 block 语句中的换行符

html - 如何修复 HTML 中 main 上的页脚覆盖

javascript - 我如何使用 jquery javascript 将大 html 表转换或打印为 pdf

php - 制作可链接到 4 个不同网站的小部件的最佳方法是什么?

javascript - pageY on div with overflow-y