2.CSS图像绘制之:菜单按钮
来源:互联网 发布:socket网络编程视频 编辑:程序博客网 时间:2024/06/05 02:18
一、HTML
<a href="">Menu</a>
二、CSS
/*使页面背景显示为绿色*/
body {
margin:50px;
font-family:arial;
background:#fbfbfb;
}
a{
text-decoration:none;
color:#999;
/*使文字右移,为图标腾出显示空间*/
text-indent:1.2em;
font-size:32px;
display:block;
/*使文字垂直居中*/
line-height:1;
position:relative;
}
/*绘制三图标*/
a::after{
content:'';
position:absolute;
left:0;
top:-4px;
width:.75em;
/*绘制三横*/
box-shadow: 0 10px 0 2px #999,0 20px 0 2px #999,0 30px 0 2px #999;
}
a:hover{
color:#2ECC71;
}
a:hover::after{
box-shadow: 0 10px 0 2px #2ECC71,0 20px 0 2px #2ECC71, 0 30px 0 2px #2ECC71;
}
0 0
- 2.CSS图像绘制之:菜单按钮
- 1.CSS图像绘制之:关闭按钮
- 4.CSS图像绘制之:字渐变按钮
- 3.CSS图像绘制之:三角图标
- 5.CSS图像绘制之:条纹背景
- css之菜单制作
- 用css制作动态水平按钮菜单
- BootStrap--CSS组件--按钮下拉菜单
- Qt之自定义菜单(按钮菜单)
- Qt之自定义菜单(按钮菜单)
- Qt之自定义菜单(按钮菜单)
- 3、文字及字体、菜单按钮、几何绘制
- 自学QT之菜单按钮(按钮菜单)即带有菜单的按钮
- 自绘制界面之--菜单(第一篇)
- 下拉菜单之CSS实现
- 利用css绘制三条横线的菜单图标
- IOS开发(79)之绘制图像
- Android 图像绘制之Matrix 的使用
- 20170212 pm html
- 《Java虚拟机》必知必会——十四个问题总结(内存模型+GC)
- 配置SonarQube,Jenkins集成扫描Android项目
- 相思风雨中
- 入门级别spring案例
- 2.CSS图像绘制之:菜单按钮
- 每日一道编程题——求比当前数值大的新排列
- mybatis 缓存
- hadoop 安装问题总结
- WireShark找不到网卡
- 关于<Script>标签在html页面放置位置
- JAVA基础及环境配置
- js中模拟队列
- python中的列表、break、continue