Specify the external link style with CSS

Most information websites, such as Wikipedia, will specify a specific style for external links (TAGS). As a user, it is a good experience to know that the link is a resource pointing to another site at a glance. Many websites perform external link check on the server side, add a property value of 'rel = external ', or add a class of 'external' to the external link. Sometimes this is impossible or difficult to use. After hanging out on the Internet, I found the following CSS style code useful for external links:

A [href ^ = "http: //"]: not ([href * = "mysite.com"]), a [href ^ = "https: //"]: not ([href * = "mysite.com"]), a [href ^ = "//"]: not ([href * = "mysite.com"]), {/* external link style. You can also use the: before or: after pseudo class if needed! */}

Note that you may need to add a browser-specific prefix for CSS rules in some browsers.
You must first limit the start character of the link protocol and then limit the domain name. So that the internal link does not match, and the external link matches the regular expression.

We recommend that you add this code snippet to your library in case you need it!