纯css 超链接变按钮
a{
font-family:Arial;
font-size:.8em;
text-align:center;
margin:3px;
}
a:link,a:visited{
color:#A62020;
padding:4px 10px; /*鼠标放上前字体位置*/
background-color:#ecd8db;
text-decoration:none;
border-top:1px solid #EEE;
border-left:1px solid #EEE;
border-bottom:1px solid #717171;
border-right:1px solid #717171;
}
a:hover{
color:#821818;
padding:5px 8px 3px 12px; /*鼠标放上后字体位置*/
background-color:#e2c4c9;
border-top:1px solid #717171;
border-left:1px solid #717171;
border-bottom:1px solid #EEE;
border-right:1px solid #EEE;
}
纯css 超链接变按钮的更多相关文章
- 1.纯 CSS 创作一个按钮文字滑动特效 + 弹幕(残缺)
原文地址:1# 视频演示如何用纯 CSS 创作一个按钮文字滑动特效 扩展后地址:https://scrimba.com/c/cJkzMfd HTML代码: <html> <head& ...
- 纯CSS实现3D按钮效果
今天分享一个用纯CSS实现的3D按钮.css巧妙利用了box-shadow来实现3D物体的立体感,当按钮按下的时候再去修改box-shadow和top值.让人感觉有一种按钮被按下的感觉.css代码非常 ...
- 前端每日实战:147# 视频演示如何用纯 CSS 创作透视按钮的悬停特效
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/qJEdKb 可交互视频 此视频是可 ...
- 32.纯 CSS 创作六边形按钮特效
原文地址:https://segmentfault.com/a/1190000015020964 感想:简简单单的动画特效,位置,动画. HTML代码: <nav> <ul> ...
- 如何用纯 CSS 创作一个按钮文字滑动特效
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. 在线预览 https://codepen.io/zhang-ou/pen/GdpPLE 可交互视频教 ...
- 如何用纯 CSS 创作六边形按钮特效
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/xjoOeM 可交互视频教 ...
- 前端每日实战:32# 视频演示如何用纯 CSS 创作六边形按钮特效
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/xjoOeM 可交互视频教程 此视频 ...
- 前端每日实战:1# 视频演示如何用纯 CSS 创作一个按钮文字滑动特效
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/zhang-ou/pen/GdpPLE 可交互视频教程 此视频 ...
- 一个标签的72变,打造一个纯CSS图标库
每次要用到图标的时候都会到 icono 去copypaste,但每次用到的时候尺寸都各不一样,总是要调整参数,巨烦.当然你可以会想到用zoom.scale来做缩放,但是这样的缩放会使得线宽也变粗了,不 ...
随机推荐
- Struts1之html标签
Struts1的html标签主要是为了绘制HTML页面标签元素,通过与Struts1框架的集成,增强功能 首先,在使用前,需要引入tld文件 <%@ taglib prefix="ht ...
- [洛谷P4779]【模板】单源最短路径(标准版)
题目大意:单元最短路径(卡$SPFA$) 题解:$dijkstra$($\underline{\hspace{0.5em}}\underline{\hspace{0.5em}}gnu\underlin ...
- [Leetcode] Interger to roman 整数转成罗马数字
Given an integer, convert it to a roman numeral. Input is guaranteed to be within the range from 1 t ...
- 深入探讨Android异步精髓Handler
探索Android软键盘的疑难杂症 深入探讨Android异步精髓Handler 详解Android主流框架不可或缺的基石 站在源码的肩膀上全解Scroller工作机制 Android多分辨率适配框架 ...
- phaser常用API总结
1. 游戏画布的尺寸 var width = game.width, height = game.height; 2. 中心点坐标 var game = new Phaser.Game(...); ...
- 【NOIP模拟赛】Evensgn 的债务 乱搞
biubiu~~~ 我们发现按照这道题的题意我们把一个个人的前后(欠钱,被欠钱)都缩一下,那么他对其他人没有影响,那么我们就可以依次缩完每个人,而且每个人最后的状态都是要买欠要么被欠,那么我们可以知道 ...
- MySQL使用笔记(七)排序和限制数据记录查询
By francis_hao Dec 17,2016 排序数据记录查询 排序是指将筛选出符合条件的数据进行有序排放,有升序(ASC(默认))方式和降序(DESC)方式. mysql> se ...
- GDB使用小记
By francis_hao Nov 7,2016 记录GDB常用功能. GDB可以让你查看一个程序在运行时其内部发生了什么,或者当一个程序崩溃时发生了什么(通过使用GDB查看core dum ...
- [spoj DISUBSTR]后缀数组统计不同子串个数
题目链接:https://vjudge.net/contest/70655#problem/C 后缀数组的又一神奇应用.不同子串的个数,实际上就是所有后缀的不同前缀的个数. 考虑所有的后缀按照rank ...
- BZOJ1040 骑士 基环外向树
1040: [ZJOI2008]骑士 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 6421 Solved: 2544[Submit][Status ...