任务二:1、选择器 2、连接集中状态的顺序 3、浮动的用发和原理 4、盒模型在IE和Google等不同浏览器的区别与联系
1、选择器类型
标签选择器,类选择器,ID选择器,组合选择器,伪类和伪元素,属性选择器,子选择器,同胞选择器, :not()选择器
1、同胞选择器
相邻同胞标签:
h2 + p{ color:red; }
选择每个h2标签后面的直接相邻的段落
(其中空格可选。(可选,就是可有可无,意思都一样))
同胞标签:
h2 ~ p{ color:red; }
选择属于h2同胞标签的所有p标签(和h2同一级的所有p)
(~表示选择h2的所有同胞标签。其中空格可选)
2、属性选择器
img[title] 如
<a href="#" class="sinaweibo"><img src="data:images/sina.png"></a>的css可以这样
a[ href=”#”]{ color:red; }
a[href^=”fttp://”] ^表示以……开始
a[href$=”.pdf”] $表示以……结束
2、 组合选择器
(组合选择了不同类型的选择器,如下面的组合使用类选择器和类型选择器)
.architec .project em{ color:red; } 表示值选择在architec 这个类下面的project类中的 em元素
3、 子选择器
body > h1 将选择body标签子标签里面的所有h1标签(注意子标签的定义)
(伪类选择器)
:first-child
:last-child
:nth-child (有着强大的功能)可以将表格隔行设置不同的样式,可以设置不同列表项目的不同样式
设置表格行颜色交替
tr: nth-child(odd){ background-color: #993366; } (偶数行)
tr: nth-child(even){ background-color: #993366; } (奇数行)
tr: nth-child(3n+2){ background-color: #993366; } (从第2个元素开始,没3个元素选择一次)
2、链接状态的顺序
链接可能出现多种状态,并且晚出现的会覆盖前面的规则所以要注意多种状态出现的顺序,按照下面的顺序规则:link visited focus hover active (缩写为LVFHA)
未完成任务:(周四完成,并更新上来)
1、 盒模型在IE goole等不同浏览器的使用和区别
2、 浮动的用法,原理
(今天没完成。在改第一个页面。2016-01-07)
(补 之前没完成的任务 2016-01-17)
1 、盒模型在IE 等不同浏览器的使用和区别
(图片传不上来)
IE和W3C分别有一套盒子模型,Firefox中采用W3C标准模型,而IE中则采用Microsoft自己的标准,W3C标准认为,盒子的宽度仅仅是内容的宽度,而IE标准认为“内容+padding+border”才是盒子的宽度,所以在ie中盒子会比标准的多两个像素。
2、基本的浮动原理
任何元素 element 都可以被浮动。段落、div、list、tables,以及图像都可以被浮动,事实上即使是像 span 和 strong 这样的行内置元素也可以很好地进行浮动。
任何申明为 float 的元素自动被设置为一个"块级元素", 这表示它可以具有申明的"width"和"height"属性。
浮动"从流程中被移除出来", 但是与绝对位置的元素不同,浮动是在他们前面的最后一个块元素之后直接被显示出来(就像盒子一样)。如果该浮动是在一个“行块”中,该浮动的上边界被放置在行块顶部的水平上。当除此以外,浮动与绝对元素相似,原先的块盒会完全忽略浮动。那些静态的块盒知识保持一个接一个地”跟随“,就好像没有浮动不在那里一样。

任务二:1、选择器 2、连接集中状态的顺序 3、浮动的用发和原理 4、盒模型在IE和Google等不同浏览器的区别与联系的更多相关文章
- css高级选择器&盒模型
css高级选择器&盒模型 1.组合选择器 群组选择器 /* 每个选择器为可以为三种基础选择器的任意一个,用逗号隔开,控制多个*/ div,.div,#div{ color:red } 后代(子 ...
- TCP连接的状态与关闭方式及其对Server与Client的影响
TCP连接的状态与关闭方式及其对Server与Client的影响 1. TCP连接的状态 首先介绍一下TCP连接建立与关闭过程中的状态.TCP连接过程是状态的转换,促使状态发生转换的因素包括用户调用. ...
- TCP连接的状态详解以及故障排查
我们通过了解 TCP各个状态 ,可以排除和定位网络或系统故障时大有帮助. 一.TCP状态 LISTENING :侦听来自远方的TCP端口的连接请求 . 首先服务端需要打开一个 socket 进行监听, ...
- IOS(SystemConfiguration)框架中关于测试连接网络状态相关方法
1. 在SystemConfiguration.famework中提供和联网相关的function, 可用来检查网络连接状态. 2. SC(SystemConfiguration)框架中关于测试连接网 ...
- TCP连接的状态与关闭方式,及其对Server与Client的影响
1. TCP连接的状态 首先介绍一下TCP连接建立与关闭过程中的状态.TCP连接过程是状态的转换,促使状态发生转换的因素包括用户调用.特定数据包以及超时等,具体状态如下所示: CLOSED:初始状态, ...
- shell基础知识---与监听服务器长连接端口状态
从未写过脚本我的最近接了俩脚本的需求,就在这分享一下我的我学到基础知识主要就四部分内容 一.变量 变量的定义 string='字符串' string="字符串" num=808st ...
- 转载:TCP连接的状态详解以及故障排查
FROM:http://blog.csdn.net/hguisu/article/details/38700899 该博文的条理清晰,步骤明确,故复制到这个博文中收藏,若文章作者看到且觉得不能装载,麻 ...
- C#如何检测网络端口连接的状态
原文:C#如何检测网络端口连接的状态 C#如何检测/监控远程连接网络端口的情况(例如:3389端口是否处于监听状态,是否建立了连接等). using System; using System.Coll ...
- 选择器(&伪)/盒模型
一.选择器高级 1.组合选择器: /*群主选择器 : 同时可以控制多个选择器*/ /*#dd,div,#a{}*/ /* d{ 起相同类名 color: red; }*/ 举例: .d1,.d2,.d ...
随机推荐
- js中的forEach
chrome和firefox支持数组的forEach,但不支持对象的forEach,IE啥都不支持 jquery中的$.each(ArrayOrObject,function)既可以遍历数组又可以遍历 ...
- Centos|Rhel搭建vsftp
vsftp,在ftp传输中相对安全的 01.安装vsftpd yum install -y vsftpd 版本信息: Installed PackagesName : vsftpdArc ...
- python学习笔记整理——dictView [未整理]
Dictionary view objects简介 The objects returned by dict.viewkeys(), dict.viewvalues() and dict.viewit ...
- Agreeing to the Xcode/iOS license requires admin privileges, please re-run as root via sudo
更新了xcode后使用goland运行项目时提示 Agreeing to the Xcode/iOS license requires admin privileges, please re-run ...
- 写启动界面Splash的正确姿势,解决启动白屏(转)
原文链接:http://www.jianshu.com/p/cd6ef8d3d74d 从我学习写第一个android项目以来,我都是这样写着启动界面: 在里面做一些事,比如:第一次启动时拷贝数据. 然 ...
- TouchSlop与VelocityTracker认识
TouchSlop是处理触摸事件中的一个常量,被系统认为滑动和点击事件的临界点.理 解这个touchSlop是一个滑动距离值的常量,也就是说当我们手触摸在屏幕上滑动时,如果滑动距离没有超过touchS ...
- Linux基础知识集锦
查看当前进程ID与当前进程的父进程ID $$ echo $PPID shell脚本之for循环 for ((i=0;i<10;++i)) do echo "hello",$i ...
- [转]跟我一起学extjs5(02--建立工程项目)
原文地址:http://blog.csdn.net/jfok/article/details/35569057 目录(?)[+] 跟我一起学extjs5(02--建立工程项目) 我们先建立一个java ...
- 【BZOJ 3735】苹果树 树上莫队(树分块+离线莫队+鬼畜的压行)
2016-05-09 UPD:学习了新的DFS序列分块,然后发现这个东西是战术核导弹?反正比下面的树分块不知道要快到哪里去了 #include<cmath> #include<cst ...
- 同 一个页面,不同请求路径,如何根据实际场景写JS
场景:使用同一个“添加群成员”的页面来操作 建群页面:建群成功后,返回查看群成员页面.在建群过程中直接添加群成员并返回一个群名称的参数. 添加群成员页面:在巳有群内添加群成员,添加成功后,返回查看群成 ...