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

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. 	<head>
  5. 		<meta charset="UTF-8">
  6. 		<title></title>
  7. 		<style type="text/css">
  8. 			#demo {
  9. 				width: 0;
  10. 				height: 0;
  11. 				/*边框的宽20px*/
  12. 				border-width: 20px;
  13. 				/*边框样式,实线*/
  14. 				border-style: solid;
  15. 				/*边框颜色*/
  16. 				border-color: transparent transparent red transparent;
  17. 			}
  18. 		</style>
  19. 	</head>
  20.  
  21. 	<body>
  22. 		<!--小三角，transparent透明的，-->
  23.  
  24. 		<div id="demo">
  25.  
  26. 		</div>
  27. 	</body>
  28.  
  29. </html>

　　2.a标签的移动端问题：

　　   1》当再点击a标签的时候，它会有默认的背景颜色，解决办法

　　　　  -webkit-tap-highlight-color:transparent;

　　　2》当点击时可能会出现下划线，解决方法

　　　　

  1.  text-decoration: none; //或者
  2.  
  3.           border: none；//或者
  4.  
  5.           outline:none;

　　　　3>当鼠标放上去时显出下划线，解决办法；

　　

  1. a:hover{
  2.  
  3. text-decoration:none;
  4. }

　　a标签是一个行内标签，如果要设置它的宽高或多个样式可通过display：block;将其变为块级标签。

　　　　

教你小三角，适用移动端等，解决移动端a标签的默认样式的更多相关文章

  1. css border制作小三角形状及气泡框(兼容IE6)

    先看下CSS盒模型 一个盒子包括: margin+border+padding+content 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三 ...

  2. css直接写出小三角

    在开发移动端项目时,总是遇到很多小三角,之前一直用图片,感觉好麻烦,今天尝试了直接用CSS写出小三角!先看看如何写出各种小三角! /*箭头向上*/ .arrow-up { ; ; border-lef ...

  3. 如何把select默认的小三角替换成自己的图片

    不同的浏览器默认的select的选项图标是不同的,例如: 在chrome中,是这样的: 未点击时    点击时  在Firefox中是这样的: 未点击时  点击时   在IE9中是这样的: 未点击时  ...

  4. CSS实现小三角小技巧

    <style> .box{ width: 20px; height: 20px; background-color: #424; border: 10px solid #9C27B0; b ...

  5. css实现小三角（原理）

    效果图如图1所示:(简单示范,有点丑,莫介意) PS:兼容IE,FF , chrome ,360安全浏览器 先讲下原理吧,如图2所示: 这个div的样式如下所示: div{ width: 0px; h ...

  6. 【学】CSS3基础实例1 - 用CSS3做网页中的小三角，以及transition的用法

    自开了博客园已经有2周了吧,虽然转载了一些觉得比较有用的文章之外还没有开始写自己的一些学习记录,那就从今天开始. 目前看了妙味的不少视频,有css+html,js的基础和中级也都看完了,作业也都做了, ...

  7. CSS通过边框border-style来写小三角

    <!DOCTYPE html> /*直接复制代码即可在浏览器验证*/ <html> <head lang="en"> <meta char ...

  8. CSS创建三角形（小三角）的几种方法

    你可以在很多地方看到三角形(小三角):tooltips提示框.下拉菜单.甚至在loading载入动画里.不管你喜欢还是不喜欢,这些小元素对各UI元素之间的联系关系式很重要的. 有一些不同的方法来设计并 ...

  9. css3旋转小三角

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. JS之判断json对象中是否含有某个key值

    var json = {"key1":"val1","key2":"val2","key3":&qu ...

  2. Jedis timeout

    处理Jedis timeout 异常 Jedis rClient = new Jedis("localhost"); 解决步骤 关闭linux防火墙 systemctl stop ...

  3. Python爬虫常用之登录(一) 思想

    爬虫主要目的是获取数据,常见的数据可以直接访问网页或者抓包获取,然后再解析即可. 一些较为隐私的数据则不会让游客身份的访问者随便看到,这个时候便需要登录获取. 一般获取数据需要的是登录后的cookie ...

  4. typescript -- ts

    算是强类型语言,javascrpt是弱类型语言,是指对数据的类型的处理,弱类型语言的特点有时候只是在支行的时候才告诉你出错了,但写的时候你是查觉不到的 ts也是以es5-7为语法标准的,开发的算是另外 ...

  5. RealProxy AOP的实现

    微软有一篇实现 一下是对于该实现的理解 https://msdn.microsoft.com/zh-cn/library/dn574804.aspx public class DynamicProxy ...

  6. inline元素、inline-block元素在float、position:fixed、position:absolute之后出现的问题

    我们知道内联元素是不能设置宽.高的,但是一旦使其脱离了文档流,就可以了,这是因为它已经变成了块级元素. 例1: <!DOCTYPE html> <html lang="en ...

  7. kafka producer自定义partitioner和consumer多线程

    为了更好的实现负载均衡和消息的顺序性,Kafka Producer可以通过分发策略发送给指定的Partition.Kafka Java客户端有默认的Partitioner,平均的向目标topic的各个 ...

  8. React 同构开发（一）

    为什么要做同构 要回答这个问题,首先要问什么是同构.所谓同构,顾名思义就是同一套代码,既可以运行在客户端(浏览器),又可以运行在服务器端(node). 我们知道,在前端的开发过程中,我们一般都会有一个 ...

  9. android 拍照和从相册选择组件

    android 拍照及从相册选择组件 单独封装到一个 activity 中便于更好的复用 拍照或从相册选择成功后使用 EventBus 发出广播回传图片路径,和调用者充分解耦合 根据传入参数支持裁剪和 ...

  10. 【ExtJS】关于Component生命周期

    很久以前就学习过extjs的组件生命周期,很久之后,再回头看一看,又增加好多新的认识. extjs组件生命周期大体分为3个阶段:初始化.渲染.销毁. 第一阶段:初始化 初始化工作开始于组件的诞生,所有 ...