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. Qt for android运行时出错 Error: Target id 'android--1' is not valid

    [提问]windows7下Qt for android运行时出错 Error: Target id 'android--1' is not valid[复制链接] 上一主题下一主题   离线yijun ...

  2. tomcat在bin下的startup.bat下启动报错

    测试环境是否安装配置好. 如果环境配置好.报错如下:或者是730013 -----------解决问题:是因为tomcat端口被占用.查看是否启动两个tomcat

  3. 「BZOJ3998」[TJOI2015] 弦论(第K小子串)

    https://www.lydsy.com/JudgeOnline/problem.php?id=3998 Description 对于一个给定长度为N的字符串,求它的第K小子串是什么. Input ...

  4. Hystrix - 踩坑回忆

    1.Unable to connect to Command Metric Stream 异常 Finchley版本使用Hystrix存在此问题.网上常规解决思路: @Bean public Serv ...

  5. python自动化day4-函数嵌套、名称空间、作用域、装饰器

    1.函数嵌套 #函数的镶套调用:在调用一个函数的过程中,又调用其他函数 def max2(x,y): if x > y: return x else: return y def max4(a,b ...

  6. jQuery懒加载插件 – jquery.lazyload.js

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  7. Comparing deep learning frameworks: Tensorflow, CNTK, MXNet, & Caffe

    https://imaginghub.com/blog/10-a-comparison-of-four-deep-learning-frameworks-tensorflow-cntk-mxnet-a ...

  8. redux-thunk, redux-logger 阮一峰 ( react中间件 )

    http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_two_async_operations.html Redux 入门教程(二):中 ...

  9. pxe-kickstart

    PXE client--->DHCP(pxelinux.0;  next-server  tftp-server) syslinux   vmlinuz initrd.img ks.cfg--- ...

  10. log4j DailyRollingFileAppender, DatePattern 配置

    在DailyRollingFileAppender中可以指定monthly(每月). weekly(每周).daily(每天).half-daily(每半天).hourly(每小时)和minutely ...