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标签的时候，它会有默认的背景颜色，解决办法

　　　　  -webkit-tap-highlight-color:transparent;

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

　　　　

 text-decoration: none; //或者

          border: none；//或者

          outline:none;

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

　　

a:hover{

text-decoration:none;

}

　　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. (STM32F4) Timer 基本操作

    Timer (計時器) 就是慢慢數時間,在timer內部有一個計數器. 而計數器會數到Register的value當數值數到設定值Timer就會發起IRQ 而程式就會轉跳到中斷向量裡頭去執行想要做的事 ...

  2. 大数据平台-修改主机名及ssh免密码登录

    一.查看服务器初始配置: 1.总核数 = 物理CPU个数 X 每颗物理CPU的核数 2.总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 # 查看物理CPU个数cat /pr ...

  3. 安装Windows 64 位 mysql 最新版本解压包中没有data目录和my-default.ini及服务无法启动的快速解决办法

    mysql官网下载地址:https://dev.mysql.com/downloads/mysql/ 首先安装包解压后,没有网上教程里面提到的data文件夹和my-default.ini 配置环境变量 ...

  4. crontab例行性共作

    一.单一工作调度 at [-mldv] TIME at -c 工作号码 -m:当at工作结束后,即是没有输出信息,以email通知用户该工作已完成 -l:at -l相当于atq,列出目前系统上所有的a ...

  5. 最近总想着写一个模拟alert和confirm插件，代替原生的

    msgbox-confirm github:  https://github.com/tong-mikasa/msgbox-confirm 主要js代码,scss代码 (function($) { $ ...

  6. Oracle触发器简单使用记录

    在ORACLE系统里,触发器类似函数和过程.1.触发器类型:(一般为:语句级触发器和行级触发器.) 1).DML触发器: 创建在表上,由DML事件引发 2).instead of触发器: 创建在视图上 ...

  7. 深刻理解Python中的元类(metaclass)（转）

    转载地址:http://blog.jobbole.com/21351/ 另外有几点理解记录下: 创建一个实例时,有时会传入参数,这些参数会同时传入 __init__() 和 __new__(),如: ...

  8. cv2.FileNode has no keys

    把 python-opencv  版本由3.4.1 换成 3.4.4之后,问题解决

  9. 如何使一个div能够铺满整个页面？ && 模态框的制作 && outerHTML

    说明: 使用 ele.outerHTML = '' 这样的方法可以很容易的清除一个元素. 当然也可以使用parent.removeChild() ,但是相较而言,还是使用 outerHTML = '' ...

  10. 《Crafting Rails 4 Applications》的笔记-第28页

    进行邮件测试,你需要在dummy目录下的虚拟程序添加一个配置 In your config/enviroments/test.rb, by default you should have the li ...