diff options
author | Florian Merz <me@fiji-flo.de> | 2021-02-11 14:51:05 +0100 |
---|---|---|
committer | Florian Merz <me@fiji-flo.de> | 2021-02-11 14:51:05 +0100 |
commit | c058fa0fb22dc40ef0225b21a97578cddd0aaffa (patch) | |
tree | df20f8b4c724b61cb9c34cdb450a7ac77d690bd0 /files/ru/glossary/css_selector | |
parent | 8260a606c143e6b55a467edf017a56bdcd6cba7e (diff) | |
download | translated-content-c058fa0fb22dc40ef0225b21a97578cddd0aaffa.tar.gz translated-content-c058fa0fb22dc40ef0225b21a97578cddd0aaffa.tar.bz2 translated-content-c058fa0fb22dc40ef0225b21a97578cddd0aaffa.zip |
unslug ru: move
Diffstat (limited to 'files/ru/glossary/css_selector')
-rw-r--r-- | files/ru/glossary/css_selector/index.html | 73 |
1 files changed, 73 insertions, 0 deletions
diff --git a/files/ru/glossary/css_selector/index.html b/files/ru/glossary/css_selector/index.html new file mode 100644 index 0000000000..c8d8885062 --- /dev/null +++ b/files/ru/glossary/css_selector/index.html @@ -0,0 +1,73 @@ +--- +title: CSS-селектор +slug: Словарь/CSS_Selector +tags: + - CSS + - CSS-селектор + - HTML + - Глоссарий + - селектор +translation_of: Glossary/CSS_Selector +--- +<p><strong>CSS-селектор</strong> это часть CSS-правила, которая позволяет Вам указать, к какому элементу (элементам) применить стиль. Например:</p> + +<pre class="notranslate"><code>***HTML*** +<div> I am inside of a div element. </div> +<p> I am inside of a paragraph element. </p> + + +***CSS*** +div { + color: green; +} + +p { + color: red; +}</code> +</pre> + +<p>В первом CSS-правиле я выбираю элемент div и задаю его стиль (цвет текста <span class="st">—</span> зелёный). Во втором CSS-правиле выбираю элемент p и задаю красный цвет текста. Вот как выглядит результат:</p> + +<p><img alt="CSS selector coding results" src="https://mdn.mozillademos.org/files/13941/cssSelectorMDNGlossary.jpg" style="border: 1px solid black; height: 101px; width: 343px;"></p> + + + +<h2 id="Смотрите_также">Смотрите также</h2> + +<h3 id="Основные_статьи">Основные статьи</h3> + +<ol> + <li>Базовые селекторы + <ol> + <li><a href="/en-US/docs/Web/CSS/Type_selectors">Селекторы по типу</a> <code>elementname</code></li> + <li><a href="/en-US/docs/Web/CSS/Class_selectors">Селекторы по классу</a> <code>.classname</code></li> + <li><a href="/en-US/docs/Web/CSS/ID_selectors">Селекторы по ID</a> <code>#idname</code></li> + <li><a href="/en-US/docs/Web/CSS/Universal_selectors">Универсальные селекторы</a> <code>* ns|* *|*</code></li> + <li><a href="/en-US/docs/Web/CSS/Attribute_selectors">Атрибутивные селекторы</a> <code>[attr=value]</code></li> + <li><a href="/en-US/docs/Web/CSS/Pseudo-classes">Селекторы состояния элементов</a> <code>a:active, a:visited</code></li> + </ol> + </li> + <li>Группирующие селекторы + <ol> + <li><a dir="ltr" href="/ru/docs/Web/CSS/Selector_list" lang="ru-RU">Список селекторов</a> <code>A, B</code></li> + </ol> + </li> + <li>Комбинаторы + <ol> + <li><a href="/en-US/docs/Web/CSS/Adjacent_sibling_selectors">Adjacent sibling selectors</a> <code>A + B</code></li> + <li><a href="/en-US/docs/Web/CSS/General_sibling_selectors">General sibling selectors</a> <code>A ~ B</code></li> + <li><a href="/en-US/docs/Web/CSS/Child_selectors">Child selectors</a> <code>A > B</code></li> + <li><a href="/en-US/docs/Web/CSS/Descendant_selectors">Descendant selectors</a> <code>A B</code></li> + </ol> + </li> + <li>Псевдо + <ol> + <li><a href="/en-US/docs/Web/CSS/Pseudo-classes">Псевдоклассы</a> <code>:</code></li> + <li><a href="/en-US/docs/Web/CSS/Pseudo-elements">Псевдоэлементы</a> <code>::</code></li> + </ol> + </li> +</ol> + +<h3 id="Техническая_справка">Техническая справка</h3> + +<p>{{SpecName("CSS3 Selectors")}}</p> |