CSS选择。 类型的选择

，每一个你想设置一个特定的颜色。 怎么办呢？ 标准的CSS选择器是不适合的标签，他们指出对所有块中的参数一次。 解决方法很简单。 分配类成员。 例如，第一个接收到的div类=“红”，第二-类=“蓝色”，第三-类=“绿色”。 现在，他们可以使用CSS表格中选择。

语法如下：表示一个点（“”），其次是写类的名称。 要管理第一单元，使用.red建设。 二- 。蓝色等。

重要！ 建议使用类属性的有意义的值。 它被认为是不好的形式使用音译（例如，krasiviy-BLOK）或字母/数字的随机组合（ojfh834871）。 在这段代码中，你一定会感到困惑，更不用说将面临那些后你谁将会参与该项目的困难。 最好的选择-使用任何方法，如BEM。

优点-较高的灵活性。

缺点 - 所述多个元件可以是一个相同的类，这意味着它们将被同时编辑。 这个问题可以用预处理器的方法以及继承解决。 一定要得到你的手少，青菜或其他一些预处理程序，它们大大简化了工作。

ID选择

关于这个版本的意见编码器和程序员都含糊不清。 CSS вообще не рекомендуют использовать ID, поскольку при неаккуратном применении они могут вызвать проблемы с наследованием. 一些 CSS 教程 不建议使用ID， 因为不准确的应用程序，他们可能会导致继承问题。 然而，许多专家都在积极整个布局安排他们。 你决定。 # »), затем имя блока. 的语法如下：井号（“＃”）， 则该块的名称。 #red. 例如，#red。

отличается от класса по нескольким параметрам. ID 是在几个方面的不同类。 ID. 首先，网页不能由两个相同的 ID。 他们被分配一个唯一的名称。 其次，这样的选择具有更高的优先级。 red и укажете в таблицах CSS красный цвет фона, а затем назначите ему же id blue и укажете синий цвет, блок станет синим. 这意味着，如果你指定一个单位类 红色 和 CSS 表指定了 红色 的背景色， 然后分配给它相同的 id蓝色 并指定颜色蓝色，单位会变成蓝色。

优点-可以控制特定元素，忽略风格的标签和类。

ID и class. 缺点-容易迷失在大量的 ID 和 阶级 。

重要！ ID вам, в общем-то, не нужны. 如果您正在使用BEM方法（或其类似物），ID 给你，一般情况下是不需要的。 该技术包括使用布局独特的类，更方便。

通用选择

{}. 语法：小星星号（ “*”）和大括号，即{*} ...

用于指定某些属性一旦页面中的所有元素。 当这可能是有用的？ box-sizing: border-box. 例如，如果你想设置的页面属性 框中上浆：边界框。 div *{}. 不仅可以用来管理文档的所有组成部分，而且要控制在规定块的所有儿童，例如，DIV * {}。

优点-你可以同时控制大量的项目。

缺点-没有足够的灵活选择。 此外，使用这种选择的，在某些情况下，减慢页面的工作。

按属性

使其能够具有特定属性的控制元素。 例如，你有许多输入标签具有不同的属性类型。 其中之一-文本，第二个-密码，第三个-数字。 当然，你可以设置每个类或ID，但它并不总是很方便。 属性的CSS选择器，可以用最大精度某些标记指定值。 例如，像这样：

输入[类型= '文本'] {}

这个选择器将选择与输入的文字类型的所有属性。

该工具是相当灵活，可以与任何标记，其中可能有属性的使用。 但是，这还不是全部！ CSS规范与更方便的控制元素的能力！

试想一下，你的页面有输入与属性占位符=“输入名称”，并输入占位符=“输入密码”。 它们还可以使用选择器选择！ 要做到这一点，使用以下结构：

输入[占位符=“输入名称”] {}或输入[占位符=“输入的口令”]

也许有属性更灵活的工作。 比方说，你有许多具有相似属性的标题（例如，“凯斯宾”和“里海”）标签。 若要选择，请根据以下选择：

[标题* = “卡斯皮斯克”]

CSS会选择所有的称号，其中有“里海”，即E.和“里海”和“里海”符号的项目。

您也可以选择开始具有一定的人物属性标签：

[标题^ = “字符，你想”] {}

或终止它们：

[标题$ = “右字符”] {}。

优势-最大的灵活性。 您可以选择任何现有的页面元素没有与类搞乱。

缺点-相对很少使用，只有在特定的情况下。 许多网页设计师喜欢的方法，因为该点类是很容易，安排众多的 方括号 和标志“平等”。 此外，这些选择不会在Internet Explorer版本7和下面的工作。 然而，谁是现在需要老的Internet Explorer？

伪类选择

表示伪状态元素。 例如，：悬停-将鼠标悬停发生了什么页面的部分，：参观-在访问过的链接。 它还包括诸如：第一，儿童和：最后一个孩子。

此类型的选择在现代的布局正在积极使用，因为多亏了它，你可以做一个网页“活”不使用JavaScript。 例如，要确保当你将鼠标悬停在按钮与类的BTN它的颜色变化。 要做到这一点，我们使用的结构如下：

.btn：悬停{

背景色：红色;

}

美容可以在按钮，则转换属性的基本属性来指定，例如，0.5秒-在这种情况下，按钮将不会立即脸红，和半秒内。

美德-被广泛用于网页“复兴”。 易于使用。

缺点 - 他们不是。 这是一个非常方便的工具。 然而，没有经验的网页设计师可以迷失在大量的伪类的。 问题是解决了学习和实践。

伪选择

“伪” -这些是不是在HTML页面的部分，但他们仍然可以进行管理。 你不明白吗？ 它比它看起来要容易得多。 例如，你想在字符串中的第一个字母大红色，让其他小和黑色文本。 当然，可以得出结论：在某一类的跨度那封信，但它的长和无聊。 这是很容易选择整个段落，并使用伪::第一个字母。 它给人的机会控制的第一个字母的外观。

有相当多的伪元素。 列出他们在一篇文章中是不可能成功的。 你可以找到你喜欢的搜索引擎的相关信息。

优势-提供灵活的定制页面的外观。

缺点 - 新他们经常被混淆。 只有在某些浏览器这类工作的许多选择。

总结

选择-文档流控制的有力工具。 多亏了他，你可以选择页面的每一个部件（甚至还有一些只是部分）。 一定要了解所有可用的选项，甚至把它们写下来。 如果你创建一个具有现代设计复杂的页面和大量互动元素的这一点尤为重要。