css中用#id.class的形式定义样式,为什么这样用,不直接写成.class.代码如下:#skin_0.selected{}这种的
<ul class="skin">
<li id="skin_0" title="蓝色" class="selected">蓝色</li>
<li id="skin_1" title="紫色">紫色</li>
<li id="skin_2" title="红色">红色</li>
<li id="skin_3" title="天蓝色">天蓝色</li>
<li id="skin_4" title="橙色">橙色</li>
<li id="skin_5" title="浅绿色">浅绿色</li>
</ul> css中:
#skin_0.selected{background-position:0px 0px;}
#skin_1.selected{background-position:15px 0px;}
#skin_2.selected{background-position:35px 0px;}
#skin_3.selected{background-position:55px 0px;}
#skin_4.selected{background-position:75px 0px;}
#skin_5.selected{background-position:95px 0px;}
#id.class的意思是一个元素定义了一个id的同时还具备对应的一个class样式。例如#skin_0.selected这个样式,就只有在li定义了id为skin_0的同时还定义了.selected的时候才会生效,如果只是给li单单定义一个selected,这个样式是不会生效的。 因为你的这一段css代码里面,列表里的6个LI的背景是一个大图里面的六个部分,所以就要单独定义每一个li的背景,但一个li被选中时,JS会给它加上一个selected的CLASS,如果直接写成.selected,就不能单个定义这6个li被选中的状态了~~
css中用#id.class的形式定义样式,为什么这样用,不直接写成.class.代码如下:#skin_0.selected{}这种的的更多相关文章
- CSS根据子元素个数不同定义样式
近日面试,遇见了一个这样的问题,不会,便记下来. 问题:如何根据子元素个数的不同定义不同的样式? 代码:HTML <ul> <li>1</li> <li> ...
- [转]用CSS给SVG <use>的内容添加样式
来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=ref ...
- 深入理解脚本化CSS系列第四篇——脚本化样式表
× 目录 [1]CSSStyleSheet [2]CSSRule 前面的话 关于脚本化CSS,查询样式时,查询的是计算样式:设置单个样式时,设置的是行间样式:设置多个样式时,设置的是CSS类名.脚本化 ...
- CSS中id与class命名规则及编码最佳习惯
一.用class_name方式写类名. 以前喜欢用class-name写,不过好像两样也没什么差别.但我比较反对用className写类名,因为始终对浏览器大小写敏感的问题抱有怀疑态度.但是id我会写 ...
- html css中id和class的区别比较
在定义样式的时候,有时候会将id和class的用法弄混淆,所以在这里特意说明一下: id和class属性是网页中两个通用的属性,它们协同工作使整个页面变得丰富多彩.当我们为一个元素定义样式时.可以使用 ...
- 林大妈的CSS知识清单(一)添加样式
回顾CSS选择符,学习接入样式的更多方式. 一.选择符 1. 种类 ① 类型选择符:直接的HTML标签名,例如: body.p.div 等: ② 后代选择符:空格,例如: div p 选择div中的所 ...
- 关于读style元素定义样式表兼容性
<span style="font-size:18px;"></span><pre name="code" class=" ...
- css遇到的那些坑——浏览器默认样式设置
今天自己写css样式,其中用到了<ul>标签,设置了一系列效果后运行,发现位置与设置有出入.chrome上打开检查项,发现<ul>标签的styles底部多了以下一段: ul, ...
- WPF 样式(定义样式、引用样式、样式作用域、Trigger触发器)
1.定义 资源字典 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presenta ...
随机推荐
- python 定义类 学习2
构造函数的变量 也叫做 实例变量 class role(): # 传参数 def __init__(self,name,role,weapon,life_value=100,moneny=15000) ...
- js-template-art【二】语法
参看地址 一.模板语法 1.变量使用与输出 <% if (user) { %> <h2><%= user.name %></h2> <% } %& ...
- iis启动 服务无法在此时接受控制信息。 (异常来自 HRESULT:0x80070425)
问题描述:每隔一段时间应用程序池就会自动停止,报错:服务无法在此时接受控制信息.(异常来自 HRESULT:0x80070425) iis启动 服务无法在此时接受控制信息. (异常来自HRESUL ...
- AtCoder Grand Contest 030 Solution
A - Poisonous Cookies 签到. #include <bits/stdc++.h> using namespace std; #define ll long long l ...
- IDFA踩坑记录
IDFA踩坑记录: 1.iOS10.0 以下,即使打开“限制广告跟踪”,依然可以读取idfa: 2.打开“限制广告跟踪”,然后再关闭“限制广告跟踪”,idfa会改变: 3.越狱机器安装开发证书打的包, ...
- WebStorm下使用TypeScript
TypeScript也可使用Visual Studio 进行开发 TypeScript官网地址:(http://www.typescriptlang.org/) 1.先安装WebStorm WebSt ...
- 【运维技术】windows安装apache服务器,实现域名对应端口的解析跳转
linux 安装参考搭建dede项目的功能 windows 安装虚拟机的指南参考:http://jingyan.baidu.com/article/29697b912f6539ab20de3cf8.h ...
- ZLYD团队第三周项目总结
ZLYD团队第三周项目总结 项目进展 我们的吃豆子游戏的程序由八个文件组成:Wall.java.Gold.java.Player.java.Fruit.java.Enemy.java.Ticker.j ...
- 论cudnn与cuda之间的关系,和实际例子测试。
1.其中cudnn是一个常见的神经网络层加速库文件,其能够很大程度的把加载到显卡上的网络层数据进行优化计算.cuda就像一个傻大粗的加速库,其主要是依靠的是显卡 计算速度跟一些算法的优化,而且其也是进 ...
- 学习Zookeeper之第2章Zookeeper安装
第 2 章 Zookeeper安装 2.1 本地模式安装部署 2.2 配置参数解读 第 2 章 Zookeeper安装 2.1 本地模式安装部署 1)安装前准备: (1)安装 jdk (2)通过 fi ...