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. js 的常用方法和对象

    每日分享: 加油!你一定可以!你是最牛逼的!!!-------------------------------------------------------------------------- - ...

  2. 论文阅读 | ExtremeNet：Bottom-up Object Detection by Grouping Extreme and Center Points

    相关链接 论文地址:https://arxiv.org/abs/1901.08043 论文代码:https://github.com/xingyizhou/ExtremeNet 概述 ExtremeN ...

  3. 分分钟钟学会Python - 数据类型（list、tuple）

    第四节 数据类型(列表.元祖) 今日内容 列表 元祖 1.列表 1.格式 users = ["ji",1,3,"gyhj"] 2.公共方法 1.len #计算长 ...

  4. UNIX SHELL基础知识总结(二)

    1. vim,vi及ex的关系 vim不需要安装,vi为ex的“Visual Mode”,Vim是vi的高级版本: 2. Unix Shell 快捷键 Ctrl+a/e将光标定位到 命令的头/尾 Ct ...

  5. Java学习之路(二)：关键字和变量，运算符

    关于关键字的一个概述 Java的关键字对Java的编译器有特殊的意义,他们用来表示一种数据类型,或者表示程序的结构,关键字不能用做变量名.方法名.类名.包名. Java常见的关键字 标识符 什么是标识 ...

  6. selenium+Python（截图保存错误页面）

    异常捕捉与错误截图 创建错误截图文件夹,目录结果如下: 用例不可能每一次运行都成功,肯定运行时候有不成功的时候,关键是我们捕捉到错误,并以把并错误截图保存,这将是一个非常棒的功能,也会给我们错误定位带 ...

  7. Node.js静态文件服务器

    首先还是先感谢github,感谢github上提供此段源码的作者.跟昨晚看的静态文件服务器来比今天的静态文件服务器稍微复杂些,可以学到很多新的东西.仔细会发现这次的代码多了一个fs.stat函数和Re ...

  8. MySQL移动数据目录出现权限问题

    MySQL移动数据目录出现权限问题 环境: ubuntu 14.04.4 LTS 现象 今天把/var/lib/mysql下的数据文件移动到其他目录下,之后发现启动mysql报错,并且mysql无法运 ...

  9. 九度oj 1032 ZOJ 2009年浙江大学计算机及软件工程研究生机试真题

    题目1032:ZOJ 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:4102 解决:2277 题目描述: 读入一个字符串,字符串中包含ZOJ三个字符,个数不一定相等,按ZOJ的顺序输出,当 ...

  10. 在Eclipse中生成javadoc

    在<thinking in java>一书的第一章提到javadoc,以前也看过,每次看到这部就跳过了,没有真正去尝试过什么样子,今天终于亲自实践了一下,原来真的挺简单:一.编写java源 ...