CSS 点击图片替换样式
1
<ul id="u1">
<li class="sea one show1">海运</li>
<li class="air one">空运</li>
<li class="express one">快递</li>
<li class="eche one">陆运</li>
</ul>
2:
#u1 li.show1.sea {
background-image: url(images/sea1.png);
} #u1 li.show1.air {
background-image: url(images/air1.png);
} #u1 li.show1.eche {
background-image: url(images/eche1.png);
} #u1 li.show1.express {
background-image: url(images/express1.png);
}
3
$("#u1 li").click(function () {
$(this).addClass("show1");
})
CSS 点击图片替换样式的更多相关文章
- 进阶实战 css 点击按钮的样式
1. html结构 <div class="menu-wrap"> <input type="checkbox" class="t ...
- 复选框checkbox——用背景图片替换样式
input { border : none; display : inline-block; width : 25px; height : 25px; -webkit-apearance : none ...
- CSS样式,雪碧,图片替换,渐变小析
Css基础2: 相对长度单位:em,rem,px,%绝对长度单位:厘米等(不用)颜色单位:rgb,rgb的百分比,16进制(#),颜色名称字体:font-size:为了更好适合点阵,尽量使用偶数fon ...
- 移动Web—CSS为Retina屏幕替换更高质量的图片
来源:互联网 作者:佚名 时间:12-24 10:37:45 [大 中 小] 点评:Retian似乎是屏幕显示的一种趋势,这也是Web设计师面对的一个新挑战;移动应用程序的设计师们已经学会了如何为Re ...
- 【onclick事件】【改变 HTML 内容innerHTML】【图片替换】【改变标签的css】【判断输入是否是数字】
1.onclick事件 <button type="button" onclick="alert('Welcome!')">点击这里</but ...
- node.js入门学习(二)MIME模块,request和response对象,demo之不同url请求不同html页面,页面包含图片、样式css等静态资源
一.构建http服务程序-根据不同请求做出不同响应 // 加载http模块 var http = require("http"); // 创建一个http服务对象 http.cre ...
- 几种垂直居中的方式及CSS图片替换技术
由于块级元素的高度是可以设置的,所以对于块级元素的垂直居中比较简单. 方法一: 在不定高的情况下,把元素的上下内边距设为同一个值即可实现,即padding :10px 0; 以上方法针对块级元素和 ...
- CSS——图片替换方法比较
图片替换主要是指将文字替换成图片的技术,即在html语句中使用文字,浏览器显示时用对应的图片显示.其意义在于便于做网站优化(SEO),文字才是搜索引擎寻找的主要对象. 经典的替换方法: Fahrner ...
- css图片替换方法
图片替换主要是指将文字替换成图片的技术,即在html语句中使用文字,浏览器显示时用对应的图片显示.其意义在于便于做网站优化(SEO),因为文字才是搜索引擎寻找的主要对象. https://www.cn ...
随机推荐
- django+uwsgi+nginx+sqlite3部署+screen
note:可通过该命令查找文件未知 sudo find / -name filename 一:项目(github) ssh root@server ip # 连接你的服务器 git ...
- ERROR 1290 (HY000): The MySQL server is running with the --skip-grant-tables option so it cannot exe
在Mysql集群中创建用户时.出现如下错误! mysql> create user 'testuse'@'localhost' identified by '111111'; ERROR 129 ...
- uva-10887-枚举
题意:集合S1和S2,把S2中的元素拼接到S1的后面去,生成新的元素,问有多少个不重复的元素 直接map.注意,不能用cin读取字符串,题目没有保证字符串中间没有空格 #include "p ...
- Java-左移右移-jdk8
移位有三种 << 左移,左边补0 >> 右移,正数左边补0,负数补1 >>> 右移, 正数,负数统一左边补0 来看几个奇葩的代码 public static ...
- ELK学习博客
ELK实时日志分析平台环境部署--完整记录 https://www.cnblogs.com/kevingrace/p/5919021.html
- 如何利用Social Listening从社会化媒体中“提炼”有价值的信息?
本文转自知乎 作者:苏格兰折耳喵 ----------------------------------------------------- 在本文中,笔者将会介绍大数据分析主要的处对象---社会化媒 ...
- 52.纯 CSS 创作一个小球绕着圆环盘旋的动画
原文地址:https://segmentfault.com/a/1190000015295466 感想:重点在小球绕环转动. HTML code: <div class="contai ...
- Mybatis学习4——多对一
一个用户对多个订单 在用户中添加属性List<user> User.java package pojo; import java.util.Date; import java.util.L ...
- 编写优秀Bug报告的艺术及案例分析
编写优秀Bug报告的艺术及案例分析 ---Rex Black原著<Fine art of writing a good bug report > ---Kiki翻译于2005/5/28 前 ...
- poi excel 设置边框字体行高行宽
final HSSFSheet sheet = wb.createSheet(sheetName + "_" + n); System.out.println("s ...