Псевдокласс :target

Последнее обновление: 04.08.2011

Псевдокласс :target задает стиль для элемента-якоря, на который был осуществлен переход.

Допустимые значения

Применимо	ко всем элементам
Соответсвие версиям CSS	CSS 3
Поддерживается браузерами	Internet Explorer 9 и выше Firefox 2 и выше Opera 9 и выше Safari 1 и выше Chrome 1 и выше

Пример

			
			span:target{

color: red;
}

Твой код:

Результат:

<br /> <span id="bigDemoCode" title="Пример в большом окне">большой полигон</span> </div> </p></div> <p> <br /> </p> <h2>Заметки</h2> <p/> <p>По теме:</p> <ul> <li><a href="/collect/html-and-css-tricks/content/target-blank/" title="перейти к статье Валидный target="_blank""> Валидный target=»_blank»</a></li> <li><a href="/manuals/html/tags/a/" title="почитать об HTML теге a "> Тег a </a></li> <li><a href="/manuals/html/attributes/target/" title="почитать об HTML атрибуте target ">Атрибут target </a></li> </ul> <p></p> <div class="innerTags"> Теги: <a href="/cloud-psevdoklassy/" title="Поиск по тегу псевдоклассы" rel="tag">псевдоклассы</a> </div> <div id="comments"> <span id="showComments" rel="388=modx">Показать комментарии</span> </div> </div> </div> </article> </div> <div class="col-md-12 col-lg-3"> <aside id="secondary" class="widget-area"> <div class="title">Статьи этого раздела</div> <ul class="child_articles"> <li class="page_item page-item-3492"><a href="https://mpbox.ru/manuals/css/pseudo-classes/default/">Псевдокласс :default</a></li> <li class="page_item page-item-3488"><a href="https://mpbox.ru/manuals/css/pseudo-classes/active/">Псевдокласс :active</a></li> <li class="page_item page-item-3491"><a href="https://mpbox.ru/manuals/css/pseudo-classes/checked/">Псевдокласс :checked</a></li> <li class="page_item page-item-3493"><a href="https://mpbox.ru/manuals/css/pseudo-classes/disabled/">Псевдокласс :disabled</a></li> <li class="page_item page-item-3494"><a href="https://mpbox.ru/manuals/css/pseudo-classes/empty/">Псевдокласс :empty</a></li> <li class="page_item page-item-3495"><a href="https://mpbox.ru/manuals/css/pseudo-classes/enabled/">Псевдокласс :enabled</a></li> <li class="page_item page-item-3496"><a href="https://mpbox.ru/manuals/css/pseudo-classes/first-child/">Псевдокласс :first-child</a></li> <li class="page_item page-item-3497"><a href="https://mpbox.ru/manuals/css/pseudo-classes/first-of-type/">Псевдокласс :first-of-type</a></li> <li class="page_item page-item-3498"><a href="https://mpbox.ru/manuals/css/pseudo-classes/focus/">Псевдокласс :focus</a></li> <li class="page_item page-item-3499"><a href="https://mpbox.ru/manuals/css/pseudo-classes/hover/">Псевдокласс :hover</a></li> <li class="page_item page-item-3500"><a href="https://mpbox.ru/manuals/css/pseudo-classes/in-range/">Псевдокласс :in-range</a></li> <li class="page_item page-item-3501"><a href="https://mpbox.ru/manuals/css/pseudo-classes/invalid/">Псевдокласс :invalid</a></li> <li class="page_item page-item-3502"><a href="https://mpbox.ru/manuals/css/pseudo-classes/lang/">Псевдокласс :lang</a></li> <li class="page_item page-item-3503"><a href="https://mpbox.ru/manuals/css/pseudo-classes/last-child/">Псевдокласс :last-child</a></li> <li class="page_item page-item-3504"><a href="https://mpbox.ru/manuals/css/pseudo-classes/last-of-type/">Псевдокласс :last-of-type</a></li> <li class="page_item page-item-3505"><a href="https://mpbox.ru/manuals/css/pseudo-classes/link/">Псевдокласс :link</a></li> <li class="page_item page-item-3506"><a href="https://mpbox.ru/manuals/css/pseudo-classes/not/">Псевдокласс :not</a></li> <li class="page_item page-item-3507"><a href="https://mpbox.ru/manuals/css/pseudo-classes/nth-child/">Псевдокласс :nth-child</a></li> <li class="page_item page-item-3508"><a href="https://mpbox.ru/manuals/css/pseudo-classes/nth-last-child/">Псевдокласс :nth-last-child</a></li> <li class="page_item page-item-3509"><a href="https://mpbox.ru/manuals/css/pseudo-classes/nth-last-of-type/">Псевдокласс :nth-last-of-type</a></li> <li class="page_item page-item-3510"><a href="https://mpbox.ru/manuals/css/pseudo-classes/nth-of-type/">Псевдокласс :nth-of-type</a></li> <li class="page_item page-item-3511"><a href="https://mpbox.ru/manuals/css/pseudo-classes/only-child/">Псевдокласс :only-child</a></li> <li class="page_item page-item-3512"><a href="https://mpbox.ru/manuals/css/pseudo-classes/only-of-type/">Псевдокласс :only-of-type</a></li> <li class="page_item page-item-3513"><a href="https://mpbox.ru/manuals/css/pseudo-classes/optional/">Псевдокласс :optional</a></li> <li class="page_item page-item-3514"><a href="https://mpbox.ru/manuals/css/pseudo-classes/out-of-range/">Псевдокласс :out-of-range</a></li> <li class="page_item page-item-3515"><a href="https://mpbox.ru/manuals/css/pseudo-classes/read-write/">Псевдокласс :read-write</a></li> <li class="page_item page-item-3516"><a href="https://mpbox.ru/manuals/css/pseudo-classes/required/">Псевдокласс :required</a></li> <li class="page_item page-item-3517"><a href="https://mpbox.ru/manuals/css/pseudo-classes/root/">Псевдокласс :root</a></li> <li class="page_item page-item-3518 current_page_item"><a href="https://mpbox.ru/manuals/css/pseudo-classes/target/" aria-current="page">Псевдокласс :target</a></li> <li class="page_item page-item-3519"><a href="https://mpbox.ru/manuals/css/pseudo-classes/valid/">Псевдокласс :valid</a></li> <li class="page_item page-item-3520"><a href="https://mpbox.ru/manuals/css/pseudo-classes/visited/">Псевдокласс :visited</a></li> </ul> </aside> </div> </div> </div> </main> <footer id="colophon" class="site-footer"> <div class="container"> <div class="row"> <div class="col-md-12 col-lg-6"> <div class="footer_title">Инфо</div> <ul> <li><a href="/about/">О проекте</a></li> <li><a href="/about-materials/">О материалах</a></li> <li><a href="/site-map/">Карта сайта</a></li> </ul> </div> <div class="col-md-12 col-lg-6"> <div class="footer_title">Разделы</div> <ul> <li><a href="/html-and-css-tricks/">HTML и CSS приемы</a></li> <li><a href="/services/">Сервисы</a></li> <li><a href="/training/">Уроки</a></li> <li><a href="/terms/terms-A/">Cловарь терминов</a></li> <li><a href="/learn/html/">HTML справочник</a></li> <li><a href="/learn/css/">CSS справочник</a></li> </ul> </div> </div> <div class="footerCopy">© 2009-2024 mpbox.ru Справочник HTML, CSS, Javascript.</div> </div> </footer> </div> <script src="https://mpbox.ru/wp-content/themes/mpbox/js/navigation.js?ver=1.0.0" id="mpbox-navigation-js"></script> <script> function toHex(form) { num = parseInt(form.num.value); form.hex.value = num.toString(16); if(form.num.value!=''&&form.num.value!='NaN'&&form.hex.value!='NaN') jQuery('#result').replaceWith('<div id="result">&#'+form.num.value+'</div>'); } document.addEventListener("DOMContentLoaded", function () { function copyToClipboard(element) { var temp = document.createElement("textarea"); temp.value = element.parentNode.nextElementSibling.textContent; document.body.appendChild(temp); temp.select(); document.execCommand("copy"); document.body.removeChild(temp); var added = document.createElement("i"); added.classList.add("added"); added.textContent = "Copied..."; element.appendChild(added); setTimeout(function () { var added = document.querySelector(".added"); added.parentNode.removeChild(added); }, 2000); } var boxElements = document.querySelectorAll(".selectCode"); for (var i = 0; i < boxElements.length; i++) { boxElements[i].addEventListener("click", function(e) { e.preventDefault(); copyToClipboard(this); }); } }); (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(88687193, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/19171282" style="position:absolute; left:-9999px;" alt="" /></div></noscript> </body> </html>