How to add properties to <a> in CSS-CodePudding

For every individual <a> tag I have on my website I have to add the properties "target="_blank" rel="noopener noreferrer". It doesn't work when I put this in my CSS stylesheet however:

a {
target: "_blank";
rel: "noopener noreferrer";
}

It says the properties are unknown, which can't make sense because they are recognized and work when I put them within the actual tag.

CodePudding user response：

Only styling can be added with css not html attributes. Eg
 You can replace below inline css style with external css
     <a href="#" style="color:blue">

    to
    <a href="#">
     a{
        color: blue;
        }

  Whatever is there in style attribute inline can be replaced with css. 
         <a href="#" target="_blank"> 
  This is target attribute and it cannot be replaced using css. Only 
   inline css using style can be replaced with external css.

CodePudding user response：

You could try using JavaScript.

<script>
    var links = document.getElementsByTagName('a');
    
        for (var i = links.length - 1; i >= 0; --i) {
            links[i].setAttribute("target", "_blank");
            links[i].setAttribute("rel", "noopener noreferrer");
        }
</script>

Insert this at the bottom of the html documents containing links. Or you could save it as a file and include the script in the header of your HTML documents.