CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章
第十三章
1.在使用浮动时,源代码的顺序非常重要。浮动元素的HTML必须处在要包围它的元素的HTML之前。
2.清楚浮动:
(1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮动元素。关键字:left、right或both。
(2).浮动外围元素:让包含浮动元素的<div>也浮动。选择这种方法一定要在浮动容器后面的任何元素中添加一个clear属性,确保浮动元素落到容器的下方。
(3).利用overflow : hidden。另一种常见的方法是在外围的样式中添加以下属性:overflow:hidden。
第十四章
1.在样式表中添加媒体查询:
(1).使用@import指令
@import url(css/small.css)(max-width:320px);
(2).在样式表中嵌入媒体查询
@media (max-width : 480px){
body {
/* style properties go here */
}
style1{
/* style properties go here */
}
}
2.防止浮动下落:
使用box-sizing : 可以重置盒模型。防止因为border产生的宽度超出而导致并排的元素被挤下去。
第十五章
1.position:
定位类型 |
属性关键字 |
特点 |
静态定位 |
static |
position的默认值 |
绝对定位 |
absolute |
会将元素位置从文档流删除 |
相对定位 |
relative |
保留元素位置,但是显示在其他位置 |
固定定位 |
fixed |
元素固定在页面某个位置不随滚动条移动 |
2.
(1).如果一个标签的位置是绝对定位的,它又不在任何设定了absolute、relative或fixed定位的标签里面,那它就是相对于浏览器窗口进行的定位。
(2).如果一个标签处在另一个设定了absolute、relative或fixed定位的标签里面,那它就是相对于另一个元素的边沿进行定位。
3.堆叠元素
绝对定位的元素处在网页的上层。
4.隐藏
方式 |
特点 |
display:none |
将元素从网页上不留痕迹的消失 |
visibility:hidden |
将元素在网页上不可见,但是位置还在 |
opacity:0 |
将元素的可见度设置为0,可以添加动画 |
十六章
1.CSS支持10种不同的媒体类型:all、braille、embossed、handheld、print、projection、screen、speech、tty和tv。
2.特别注意以下3中媒体类型:
(1).all:适用于每一种设备
(2).screen:只适用于显示器
(3).print:只适用于打印网页
3. 添加media样式表
(1). 给外部样式表指定媒体类型:
<link rel=”stylesheet” media=”print” href=”print.css”/>
从技术上来讲,CSS规则允许在用@import方法添加外部样式表的同时定义媒体类型,像这样:@import url(print.css)print;但是IE8不支持这行代码因此最好不用。
(2)在样式表中指定媒体类型
可以利用@media指令直接在样式表中定义特定的媒体类型。
@media print{
/* put your styles for the printer in here */
}
第十七章:
CSS设计习惯
1.添加注释
2.使用多个类来创建样式
3.使用派生选择器
4.在一个外部样式表中使用@import导入多个样式表,然后链接到网页中。
CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章的更多相关文章
- CSS3秘笈复习:第九章&第十章
第九章 1.和链接有关的伪类: (1):link,未访问过的链接 (2):visited,已访问过的链接 (3):hover,鼠标悬停链接 (4):active,单击链接时 这四种方式一定要严格按上面 ...
- CSS3秘笈复习:第六章
第六章 1.文本大写化: text-transform:uppercase; 另外三种选项是:lowercase或capitalize以及none. 2.文本修饰: text-decoration:u ...
- CSS3秘笈复习:第七章
1.边距冲突: 当元素的bottom margin碰到另一个元素的top margin可能会产生一些怪异的计算,浏览器会忽略小的那个值而使用大的值. 2.边距折叠: 假设要在警告框里插入一个标题,并且 ...
- CSS3秘笈复习:第一章&第二章&第三章
第一章: 1.<cite>标签不仅可以将网页设置为斜体,还能给标题做上标记,使它便于被搜索引擎搜索到. 第二章: 1.import指令链接样式表: CSS本身有一种添加外部样式的方法:@i ...
- CSS3秘笈复习:第十一章
1.text-align与vertical-align: text-align控制水平方向的定位,关键字是left.right.center和justify. vertical-align控制垂直方向 ...
- CSS3秘笈复习:第八章
一.背景的所有属性: 属性 作用 可选项 1.background-image 定义一张图片 url(...) 2.background-repeat 控制重复 no-repeat | repeat- ...
- 程序员编程艺术第三十六~三十七章、搜索智能提示suggestion,附近点搜索
第三十六~三十七章.搜索智能提示suggestion,附近地点搜索 作者:July.致谢:caopengcs.胡果果.时间:二零一三年九月七日. 题记 写博的近三年,整理了太多太多的笔试面试题,如微软 ...
- CSS3秘笈:第十二章&第十三章
第十二章 1.网页布局类型 (1)固定宽度 (2)流式 (3)响应式Web设计 2.CSS布局的方法 通过给元素设置一个宽度,将它浮到左侧或右侧,就可以创建一个列(元素后面的文本会环绕浮动的元素,仿佛 ...
- CSS3秘笈:第四章
第四章 继承 1.继承:应用在一个标签上的CSS样式被传到其内嵌标签上的过程. 2.继承的局限性: (1)有些属性不会被继承,如:CSS. (2)以下情况不会严格执行继承: ·影响网页元素位置的属性 ...
随机推荐
- Linux install sogou input method
# Copyright (c) 2016, 付刘伟 (Liuwei Fu)# All rights reserved.# 转载请注明出处 Linux下安装搜狗输入法需要安装以下插件,当以下所有插件安装 ...
- Secondary Namenode - What it really do?
原文链接:http://blog.madhukaraphatak.com/secondary-namenode---what-it-really-do/ Secondary Namenode is o ...
- angular中的cookie读写
AngularJS中对cookie的操作封装了一个单独的模块,模块名为ngCookies,若想使用需在页面中先引入angular-cookies.js: <script src="js ...
- Jstatd方式远程监控Linux下 JVM运行情况
前言 最近一个项目部署在服务器上运行时出现了问题,经过排查发现是java内存溢出的问题,所以为了实时监控服务器java内存的情况,需要远程查看服务器上JVM内存的一些情况.另外服务器系统是CentOS ...
- 有关C语言学习的调查
有关C语言学习的调查 1.Q:你是怎么学习C语言的?(作业,实验,教材,其他),与你的高超技能相比,C语言的学习有什么经验和教训? A:之间在暑假的之后自己有买了一本C PRIME PLUS 来看基本 ...
- mybatis学习笔记二(接口注解)
直接上代码,全部在代码里讲解. 1.实体类 package com.home.entity; /** * 此类是:user实体类 * @author hpc * @2017年1月10日下午9:36:5 ...
- python reduce使用实例
通过一个简单的算法来了解reduce的巧用. 构建函数persistence(n),如果n>9,则返回0.否则继续根据n的权重来分解n,如n=999,则分解为9,9,9.那么将9*9*9=729 ...
- <hdu - 1232> 畅通工程 并查集问题 (注意中的细节)
本题链接:http://acm.hdu.edu.cn/showproblem.php?pid=1232 结题思路:因为题目是汉语的,那我就不解释题意了,要求的是最少建设的道路,我们可以用并查集来做这 ...
- 五大科技巨头VR/AR专利报告,Magic Leap以22.6%领跑
在十月份发布的<VR/AR专利技术深度分析报告>指出,VR.AR行业的专利多被佳能.索尼.微软.谷歌等科技巨头"包养",但是并没有对这部分进行详细分析.近日,风投公司C ...
- VS2015转VS2008
对于Windows8及以上的系统,无法安装VS2008,也不是无法安装,如果玩游戏多的,应该已经安装了.NET3.5,可以正常安装. 既然不能安装VS2008,那就安装VS2015好了,现在已经是Up ...