html - 输入中的 CSS 区分样式[type=text]

Question

我有几个input[type=text]字段，我想以不同的方式自定义它们。

我必须知道，我们甚至可以为name房产应用我们的样式。

我可以将 CSS 样式应用于元素名称吗？

不幸的是，它在我的情况下不起作用。

我的代码如下所示：

fig input[type=text]
        {
            width: 250px;
            min-width: 100px;
            padding: 12px 20px;
            box-sizing: border-box;
            outline: none;
            border: 1px solid #f7fbff;
            background-color: #f7fbff;
            display: inline-block; 
        }

             <figure class="fig">
            <input type="text" name="riser_cupboard_key_type" 
                                                    pattern="[A-Za-z].{4,}" 
                                                    title="The text should include at least 4 
            letters" placeholder="Enter your answer" required>
         </figure>

所有选项都不起作用

 .fig input[type=text] > input[name="riser_cupboard_key_type"] {
    width: 600px;
 }

 .fig input[type=text]  input[name="riser_cupboard_key_type"] {
    width: 600px;
 }

 .fig input[name="riser_cupboard_key_type"] {
    width: 600px;
 }

我怎样才能使这个指定的输入与其他输入不同？

标签： htmlcss

Answer 1

这应该有效：

.fig input[type=text][name="riser_cupboard_key_type"] {
    width: 600px;
 }