The dom element of tag a package is not displayed normally in Some browsers.

The dom element of tag a package is not displayed normally in Some browsers.

It appears on Apple and some Android machines, and will not appear in the responsive design of pc and chrome browsers.
After access, the dom element of the tag package is not displayed normally.
The hr element color in tag a is not displayed normally.
The hr horizontal line color is bootstrap's css

a {  color: #428bca;  text-decoration: none;} 
a:hover,a:focus {  color: #2a6496;  text-decoration: underline;}

Or the user agent stylesheet

a:-webkit-any-link {  color: -webkit-link; }a:-webkit-any-link:active{ color: -webkit-activelink}

Overwrite
The reason is that hr css adopts

Border-top: 1px solid # xxxxx, when the border-color of hr is set to xxx, the dom structure is as follows: <a> <div> </div> 
Some browsers will mistakenly render the hr border-color by the color of.
The solution is to set hr to css {border: 0; height: 1px; color: $ spilt_line; width: 100% ;}

When I encountered this problem, I also tried several other solutions or combined or excluded solutions, but they were ineffective (they could not be solved ),
Like me
a{position:relative; z-index:-5;} hr{ position:relative; z-index:10;}
 
Or
hr{border-top: 1px solid #xxx !important;}
Or
a{     color:transparent;    &:link { @extend a}            &:visited {@extend a}        &:hover {@extend a}        &:active {@extend a}}a:-webkit-any-link{ color: transparent;}a:-webkit-any-link:visited{ color: transparent;}a:-webkit-any-link:active{ color: transparent;}or a {color:rgba(0,0,0,0)}
 
And suspected and set
-Webkit-tap-highlight-color: rgba (,); // click the highlighted color in the mobile browser of the webkit kernel.
It even deletes all a color-related classes, but it is useless and will be added by the user agent.
Different browsers have their own default styles.
Default webkit Browser style a:-webkit-any-link {color:-webkit-link; text-decoration: underline; cursor: auto;} a:-webkit-any-link: active {color:-webkit-activelink} mozilla * | *:-moz-any-link {cursor: pointer;} * | *:-moz-any-link: -moz-focusring {/* Don't specify the outline-color, we shoshould always use initial value. */outline: 1px dotted;}/* default opera style */a {color: # 00C; text-decoration: underline;} iea: visited {color: #800080 ;}