Vấn đề CSS, vấn đề input[id]+label, :hover và :checked

In lại 作者：行者123 更新时间：2023-11-28 03:57:08 27 4

input[type=checkbox]{
   display:none;
}

nhãn {
      /* clickable area */
    chiều cao: 150px;
    width: 150px;
    margin: 0.75em;
    hiển thị: khối nội tuyến;
}
input[id=chkGeneral] + label{
    background: url('http://velvetcookierecords.com/wp-content/uploads/2014/10/fb-icon-150px-x-150px.png');
    background-size:100%;
    height:100px;
    width:100px;
}
input[id=chkGeneral]:hover + label{
    background: url('http://vignette1.wikia.nocookie.net/sonsofanarchy/images/d/d3/IOS_Icon_150px.png/revision/latest?cb=20130903223258');
    background-size:100%;
    height:100px;
    width:100px;
}
input[id=chkGeneral]:checked + label {
    background: url('http://re-vision.com/webwork/p09image-size-tags/ape-silverback.jpg');
    background-size:100%;
    height:100px;
    width:100px;
}

input[type=checkbox] {
  display: none;
}

nhãn {
  /* clickable area */
  chiều cao: 150px;
  width: 150px;
  margin: 0.75em;
  hiển thị: khối nội tuyến;
}

input[id=chkGeneral]+label {
  background: url('http://velvetcookierecords.com/wp-content/uploads/2014/10/fb-icon-150px-x-150px.png');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

input[id=chkGeneral]+label:hover {
  background: url('http://vignette1.wikia.nocookie.net/sonsofanarchy/images/d/d3/IOS_Icon_150px.png/revision/latest?cb=20130903223258');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

input[id=chkGeneral]:checked+label {
  background: url('http://re-vision.com/webwork/p09image-size-tags/ape-silverback.jpg');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

input[type=checkbox] {
  display: none;
}

nhãn {
  /* clickable area */
  chiều cao: 150px;
  width: 150px;
  margin: 0.75em;
  hiển thị: khối nội tuyến;
}

input[id=chkGeneral]+label {
  background: url('http://velvetcookierecords.com/wp-content/uploads/2014/10/fb-icon-150px-x-150px.png');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

input[id=chkGeneral]:checked+label {
  background: url('http://re-vision.com/webwork/p09image-size-tags/ape-silverback.jpg');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

input[id=chkGeneral]+label:hover {
  background: url('http://vignette1.wikia.nocookie.net/sonsofanarchy/images/d/d3/IOS_Icon_150px.png/revision/latest?cb=20130903223258');
  background-size: 100%;
  height: 100px;
  width: 100px;
}

27 4 0

• html - 使用 [checked] 或 [checked ="checked"]

  这个问题在这里已经有了答案: What's the proper value for a checked attribute of an HTML checkbox? (10 个答案) 关闭 8 年

• jquery - 自定义复选框 : how to check whether check box is checked or not

  我使用这个制作了自定义复选框: enter link description here 也可在 stackoverflow 上获得:enter link description here 但我正在尝试

• javascript - .checked = true 或 setAttribute ("checked", "checked") 未附加

  我需要使用 CSS“checkbox-hack”来实现滑动菜单指示器效果，我唯一的方法是通过 JavaScript 附加输入元素。我被迫通过在线工具 MonoSolutions 执行此操作，并且我受到

• javascript - Bootstrap : how to check if an elment is checked and set it to disable if checked

  此代码运行良好，但缺少一些我需要的东西。基本上，如果输入有一个 checked="checked" 属性，它应该使其他两个元素保持禁用状态。如果未选中，则元素已启用。 这是我在 jsFiddle 上的

• tfs - Visual Studio TFS check out 缺少 "Check out" check out 类型

  当我的人 checkout 文件时，我希望他们将其锁定，以便其他人也无法进行更改，我从这篇文章中看到:http://msdn.microsoft.com/en-us/library/jj155783.

• c# - Check.Assert()、Check.Ensure() 和 Check.Require() 有什么作用？

  请告诉我这些函数的作用。 最佳答案 这些是基于框架的、与语言无关的方法，用于在 .NET 中定义代码契约。虽然某些语言(如 spec# 和 Delphi Prism)对代码契约具有一流的语言支持，但这

• javascript - $ ('.input:checked' ) 的行为不同于 $ ('.input[checked=checked]' )

  假设以下场景:您有 2 个单选按钮，它们具有相同的名称，并且都被选中(我知道这是无效的): 为什么下面两个选择器的行为不同？ $('.input:checked').size(); // retu

• jquery - .attr ('checked' ,'checked' )不起作用

  我正在尝试收听广播。以下均不起作用: [编辑] $('selector').attr('checked','checked'); $('selector').attr('checked',true);

• dart - 参数类型“CheckIng”不能分配给参数类型“(()-> Check In”

  我实际上在努力理解此类型错误。 任何人都知道我如何更正代码？谢谢 CheckIn checkin1 = new CheckIn(location1, dt); CheckInMonths checkI

• jquery - .attr ('checked' 、 'checked' )无法按预期工作

  我有这段代码，但不起作用。 .on("click","span.name", function selectThisName(e) { if (e.altKey) {

• 安卓 Espresso : checking for a checked checkbox

  我现在是 Espresso 的新手，我遇到了这个异常: android.support.test.espresso.AmbiguousViewMatcherException: 'with id: a

• html - 选项更改时单选按钮 "Checked=checked"不更改

  我已经创建了一个基本的 2 单选按钮表单，如下面的示例所示。 观察浏览器渲染，我们看到元素 1 被选中。我们检查元素 1 和元素 2。 当我点击元素 2 时，我希望元素 1 的 checked=che

• javascript - jquery attr ('checked' ,'checked' ) 只工作一次

  我在查找以下 jquery/checkbox 行为的原因时遇到问题。 $( this.obj + ' table.sgrid-content > thead > tr > th > input.sel

• azure 逻辑应用: not corrently checking empty check

  以下逻辑应用在上午 10 点触发并运行 SQL Server 查询。从图片中可以看出，结果集是空的。 条件检查检查查询的结果集是否为空。 (第二张图) 这仍然如何转化为 True？结果显然是空的。 最

• java - 什么更快 : equal check or sign check

  我想知道哪种操作更快: int c = version1.compareTo(version2); 这个 if (c == 1) 或者这个 if (c > 0) 符号比较是否只使用一位检查，而相等比较

• Angular : $pristine for ng-check checked inputs

  我有一个包含大约 100 个问题的表单，每个问题都有一个单选按钮和一些复选框，因此我需要用户能够保存表单并在以后加载它。我还需要检查用户在此 session 中更改了哪些。 本题解决问题:How ca

• python - Tkinter问题: checking one checkbox checks all of them

  我正在编写一个小程序，需要用户决定一些 bool 值。我已经制作了复选框来处理这一部分，但问题是每次我选中或取消选中一个复选框时，所有其他复选框都会跟随。 我在网上搜索过，但我找到的唯一解释( pyt

• jquery - 为什么 .attr ('checked' ,'checked' ) 不会设置？

  我有以下代码片段(我使用的是 jQuery 1.4.2): $.post('/Ads/GetAdStatsRow/', { 'ad_id': id }, function(result) {

• javascript - checkbox 有 checked 属性但不显示 checked

  我的代码发生了一些奇怪的事情。我有两个按钮，其中一个带有 .add 和 .remove 类，有一个复选框会根据按下哪个按钮而打开和关闭，因此如果您使用删除按钮删除，则选中的复选框将被选中，否则复选框将

• android - 如何将列表中的所有复选框 'check' 改为 'check' 单个复选框？

  我陷入了一种情况，我必须通过“选中”工具栏中的复选框来“选中”列表中存在的所有复选框。 这是创建复选框列表的代码:- itemTpl: 'checked="checked" /> {groupName