首页 > 代码库 > 教你小三角,适用移动端等,解决移动端a标签的默认样式
教你小三角,适用移动端等,解决移动端a标签的默认样式
1.小三角,通过给一个div设置足够大的边框,让它的上边框,右边框,左边框,的背景颜色设置成透明的,来实现,如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #demo { width: 0; height: 0; /*边框的宽20px*/ border-width: 20px; /*边框样式,实线*/ border-style: solid; /*边框颜色*/ border-color: transparent transparent red transparent; } </style> </head> <body> <!--小三角,transparent透明的,--> <div id="demo"> </div> </body> </html>
2.a标签的移动端问题:
1》当再点击a标签的时候,它会有默认的背景颜色,解决办法
1 -webkit-tap-highlight-color:transparent;
2》当点击时可能会出现下划线,解决方法
1 text-decoration: none; //或者 2 3 border: none;//或者 4 5 outline:none;
3>当鼠标放上去时显出下划线,解决办法;
a:hover{ text-decoration:none; }
a标签是一个行内标签,如果要设置它的宽高或多个样式可通过display:block;将其变为块级标签。
教你小三角,适用移动端等,解决移动端a标签的默认样式
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。