小编Mec*_*dor的帖子

样式自定义复选框没有出现图像

我正在尝试HTML和CSS,并且对整个概念来说相对较新.我目前正致力于使用Photoshop制作的图像设计自定义复选框.当我以这种方式设置时,我无法弄清楚为什么我的图像没有出现.

HTML

<ul id="myUL" class="ulChecklist">
  <form action="/action_page.php">                   
    <li><input type="checkbox" name="instruction">
      <label for="Step1">Step 1</label>
    </li>
    <li><input type="checkbox" name="instruction">
      <label for="Step2">Step 2</label>                    
    </li>
    <li><input type="checkbox" name="instruction">
      <label for="Step3">Step 3</label>                    
    </li>
  </form>
</ul>
Run Code Online (Sandbox Code Playgroud)

CSS

input[type="checkbox"] {
opacity: 0;
}

input[type="checkbox"] + label {
background: url(check.png) left center no-repeat;
}
Run Code Online (Sandbox Code Playgroud)

这是我要添加的预先检查的图像. 检查我要添加的图像

这是我要添加的后检查图像. 这是我要添加的后检查图像.

如你所见,它没有出现. 在此输入图像描述

我写这些代码的方式有问题吗?我查看了以下Lynda课程链接:https://www.lynda.com/HTML-tutorials/Styling-radio-buttons-check-boxes-images/612196/646907-4.html

但它对我不起作用.我非常感谢人们的帮助!感谢您抽出宝贵时间回答菜鸟的问题!

html css

1
推荐指数
1
解决办法
116
查看次数

标签 统计

css ×1

html ×1