Question

我想知道你们是否可以帮助我了解这些实际的语法结构在CSS中的作用，因为我真的很难理解他们。

A。所有输入元素的一般样式

#input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

B。 ??????

 .input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

C。表格元素中的表单输入

table input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

D。 ???

table .input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

E。 ??????????

table input[type="text"] 
{
   width:100%;
   border: 1px solid #000;
   font-size: 14px;
   padding: none;
}

我认为这些都能达到相同的结果，而不是“输入”元素吗？

每个人的html代码是什么？

“class”或“id”何时适用于这些？

很抱歉，如果这看起来像是一个基本问题，但我正在努力了解CSS的最佳实践，当我看到所有这些不同的CSS符号时，学习960 Grid Square有点困难。

谢谢你的时间！

Answer 1

#符号表示它是ID选择器，因此它仅适用于页面上具有该特定ID的单个元素。您对示例A的说法不正确 - 它实际上是ID为input的元素的选择器，而不是所有输入的常规选择器。

.符号表示它是一个类选择器，因此它将应用于具有该类的所有元素。

[type="text"]是一个属性选择器，因此它只会选择type属性值等于text的输入元素。

Answer 2

<强> A 即可。具有id="input"

的元素

#input

<强>乙即可。 class="input"

的元素

.input

<强> C 即可。表元素中的表单输入

table input

<强> d 即可。表格中包含class="input"的元素

table .input

<强>电子即可。在表格中输入具有属性type="text"的元素

table input[type="text"]

所有CSS selectors都以w3解释，或者更容易在tutplus上阅读。

什么是最好的？

这里没有一般的最好。这取决于你想做什么。如果您的表单包含一些您想要样式的输入，则可以使用#formid input。但是您可能有不同的输入元素，其默认样式不起作用。 type="radio"可能需要与type="text"不同的样式。

Answer 3

A =＆gt; id为'input'的元素

b =＆gt;带有'input'类的元素/

c =＆gt;表中的输入字段

d =＆gt;表'element'中的元素

e =＆gt;表格中的文字字段

Answer 4

这些是CSS中不同的选择器

“#input”----------表示您正在选择id =“input”的元素

“。输入”-----------您正在选择class =“input”

“表输入”------表示您正在选择表标记

中的每个输入标记

依旧......

是的，请看一些教程

Answer 5

它们是CSS中不同的选择器。

。表示可以分配给许多元素的类。＃指的是Id，这意味着为了维护有效的HTML，它只能用在一个元素上。您可以使用html标记的ID部分访问＃属性集。

使用＃有其局限性，因此没有广泛使用。

Answer 6

一个。按ID
湾按类别设置元素
℃。样式嵌套在任何表单元素中的任何输入元素
d。使用任何形式的“输入”类来设置任何元素的样式
即在表单

Answer 7

#input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

Ans：id = input

的元素

.input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

Ans：class = input

的元素

table input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

Ans：在表元素中输入元素

table .input
{
    width:100%;
    border: 1px solid #000;
    font-size: 14px;
    padding: none;
}

Ans：class = input的元素在表元素内

table input[type="text"] 
{
   width:100%;
   border: 1px solid #000;
   font-size: 14px;
   padding: none;
}

Ans：在表元素

中输入type = text的元素

Answer 8

答：您的目标是ID为“输入”的元素，即<input id="input" /> B：和以前一样，现在是一个班级，即<input class="input" /> C：表元素中的表单输入 D：表中具有“输入”类的元素 E：表中包含“text”类型的输入元素，即<input type="text" />（在表中）。

我真的建议你选一些关于基本HTML和CSS的书。

Answer 9

点击此链接w3schools.com/css/css_id_class.asp 在案例A中你的css是不正确的：它应该只是输入而不是#input。＃表示您按ID选择。 B表示您按班级选择

CSS的这些语法有何不同？

9 个答案: