CSS中#和.的区别
id:用来定义页面中大的样式,如栏目划分,顶部,正文,底部等;用#top的形式来定义;
class:用来定义一些比较细节的样式,如具体的一个菜单,一行文字等,用.text的形式来定义。
定义HTML中的标签,如ul,img,p等时,直接写:img{}
class是样式组,用.style定义,class="style":
.style定义样式组,可以被反复调用,就是说你一个页面里,可以有多个元素用同一个style;
ID是固定标签,用#style1定义,ID="style1"
#main和.main有什么区别:
#main 定义的是ID为"main"这个元素的样式
.main 的意思是新建一个名为"main"的样式
#main 只能定义ID为"main"这个元素的样式
.main 一但定义以后,可以让其他的元素来调用,方法为class="main"
用#定义CSS样式,在调用时必须用ID,用.定义CSS样式,在调用时必须用CLASS。用#定义的样式,一般都是定义结构框架,一些大的容器,且在同一个页面只能出现一次;而.定义的样式,一般都是起修饰作用或多次重复的样式。还一点就是在同一个层里同时出现ID和CLASS样式,ID更优先于CLASS。
简单来说: #main是定义具体对象main的专有属性;.main是定义抽象对象的共有属性main。比较广泛的用途是#用于定义网页框架;.用于定义各个网页元素。#main中的main只能在网页中出现一次,而.main中的main可以出现无数次。
使用范例
class:
.footer{background:red;}
footer
id:
#footer{background:red;}
footer
定义class的css是用点:“.”,如.footer
定义id的css是用井号“#”,如#footer
CSS中#和.的区别的更多相关文章
- CSS中"!important"的使用
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- CSS中!important的优先级
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- CSS中!important的使用 转
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22::) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素 ...
- css中单位px、pt、em和rem的区别
国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? px :像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.(引自CSS ...
- 彻底弄懂css中单位px和em,rem的区别
国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 -1. IE无法调整那些使用px作为单位的字体大小: -2. 国外的大部分网站能够调 ...
- CSS中的class与id区别及用法
转自http://www.divcss5.com/rumen/r3.shtml及http://www.jb51.net/css/35927.html 我们平常在用DIV CSS制作Xhtml网页页面时 ...
- CSS中单位px和em,rem的区别
PX特点: 1 IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...
- CSS中margin和padding的区别
在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离.在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离. 下面讲解 padding和ma ...
- css中px,em和rem的区别
css中px,em和rem的区别 今天,突然间发现一个特别有意思的问题,就是无意间看到一个网站中的em并不是16px,下面展开了对于px和em以及rem的探究. 首先,px是绝对长度单位,是相对于显示 ...
随机推荐
- [原创]Mybatis特殊值Enum类型转换器-ValuedEnumTypeHandler
引言 typeHandlers 阅读官方文档 typeHandlers 一节{:target="_blank"} MyBatis 在预处理语句(PreparedStatement) ...
- fatal error C1083: 无法打开包括文件:“qedit.h”: No such file or directory
VS2010编译 DirectShow一些项目时遇到 错误:fatal error C1083: 无法打开包括文件:“qedit.h”: No such file or directory 解决方法: ...
- 【总结整理】原创概念原创idea---摘自《结网》
假如你有一个原创想法,搜索引擎是否已有现成产品与自己的想法一致,如果有,研究他可以节省很多摸索的时间:若没有,那就是一个货真价实的原创idea: 第一类:受到现有产品的启发,将既有概念进行了转换. 第 ...
- Bootstrap 中的 aria-label 和 aria-labelledby 属性
这两个属性是为特殊网页阅读器设置的属性,在一些特殊设备上,当浏览到这样的内容设备会将内容读出来.是为了一些有视力障碍的人能够同样”浏览”网页而准备的. 转自http://blog.csdn.net/l ...
- Service和IntentService的区别
不知道大家有没有和我一样,以前做项目或者练习的时候一直都是用Service来处理后台耗时操作,却很少注意到还有个IntentService,前段时间准备面试的时候看到了一篇关于IntentServic ...
- ubuntu开启ssh
SSH分客户端openssh-client和openssh-server如果你只是想登陆别的机器的SSH只需要安装openssh-client(ubuntu有默认安装,如果没有则sudo apt-ge ...
- Luogu 4213 【模板】杜教筛(Sum)
当作杜教筛的笔记吧. 杜教筛 要求一个积性函数$f(i)$的前缀和,现在这个东西并不是很好算,那么我们考虑让它卷上另外一个积性函数$g(i)$,使$(f * g)$的前缀和变得方便计算,然后再反推出这 ...
- Ubuntu 14.04 安装配置强大的星际译王(stardict)词典
转载http://blog.csdn.net/huyisu/article/details/53437931
- 第七课 ROS的空间描述和变换
在命令行工具中也有一个与transformcaster相类似的工具叫做static_transform_publisher,它能够接受命令行参数来接受位置信息.旋转信息.父框架.子框架以及周期信息,通 ...
- POJ1125 Stockbroker Grapevine(spfa枚举)
Description Stockbrokers are known to overreact to rumours. You have been contracted to develop a me ...