[CSS3] CSS :target Selector

The :target selector allows us to interact with a fragment identifier, or hash, in our URL from CSS.

HTML:

<body>
    <a href="#tab1">Tab 1</a><a href="#tab2">Tab 2</a><a href="#tab3">Tab 3</a>
    <div id="tab1" class="tab">
        <h1>Tab 1 Content</h1>
    </div>
    <div id="tab2" class="tab">
        <h1>Tab 2 Content</h1>
    </div>
    <div id="tab3" class="tab">
        <h1>Tab 3 Content</h1>
    </div>
</body>

CSS:

    <style>
        .tab{
            display: none;
        }
        .tab:target {
            display: block;
        }
    </style>

原文地址:https://www.cnblogs.com/Answer1215/p/5468599.html