Shulou(Shulou.com)06/01 Report--

This article mainly explains "how to use CSS3 target pseudo-class selector target". The explanation in this article is simple and clear, easy to learn and understand. Please follow the idea of Xiaobian and go deep into it slowly to study and learn "how to use CSS3 target pseudo-class selector target" together.

How to use CSS3:target selector

target is one of the CSS3 pseudo-class selectors used to match the target element of an identifier in text.# The name of the anchor is the url linked to the element in a file, and the element is linked to the target element. The target selector can be used for the style of the currently active target element.

Specifically, the url generally contains a #followed by a name, such as #aa,:target is the target element with matching id "aa". For example: if there is an a tag in a page, its href is as follows: button 3, the same page will also have an element with box as id, related content 3

Then the href attribute of the a tag links to the #box, i.e. the target element selected by the box:target selector, and the style specified is the style of the target element when a links to this element. For example, if you want to change the font size of an element linked to #tab, you can do this: #tab:target{font-size:30px}.

CSS3:target instance

Just use CSS to achieve, click on title 1, jump to content1, click on title, 2, jump to content2 effect.

HTML section:

Heading 1

Heading 2

title 3

content1

content2

content3

CSS section:

:target

{

border:2pxsolid#D4D4D4;

background-color:#e5eecc;

font-size:25px;

}

Thank you for reading, the above is "CSS3 target pseudo-class selector target how to use" the content, after the study of this article, I believe we have a deeper understanding of how to use CSS3 target pseudo-class selector target, the specific use of the situation also needs to be verified by practice. Here is, Xiaobian will push more articles related to knowledge points for everyone, welcome to pay attention!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.