zoukankan      html  css  js  c++  java
  • 教你小三角,适用移动端等,解决移动端a标签的默认样式

    1.小三角,通过给一个div设置足够大的边框,让它的上边框,右边框,左边框,的背景颜色设置成透明的,来实现,如下:

    <!DOCTYPE html>
    <html>
    
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<style type="text/css">
    			#demo {
    				 0;
    				height: 0;
    				/*边框的宽20px*/
    				border- 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;将其变为块级标签。

        

  • 相关阅读:
    HTML转换成word文档
    泛型的导入导出的公用方法
    封装的分页jq
    用泛型做的分页类
    EntityFramework小知识
    泛型连接数据库
    在博客园看的一些小技巧
    渗透之路基础 -- SQL注入
    第一篇博客就这么开始了?!稍微介绍一下。
    正则基础用法
  • 原文地址:https://www.cnblogs.com/cyj-dz/p/7124407.html
Copyright © 2011-2022 走看看