不同的浏览器(包括-moz-代表的Mozilla Firefox, -ms-代表的Microsoft Internet Explorer等)厂商在发布正式版本之前之前, 试验各自对CSS3新特性的实现, 正式版本发布后就不再需要前缀, 遵循样式表的层叠特性, 我们将无前缀的代码放在最后, 这样如果该特性可用, 则会覆盖之前的声明

1.display 中 block, inline, inline-block 的区别

  1).默认情况下, block 宽度占满整个浏览器, inline 宽度等于其内容的宽度

  2).每行只容纳一个 block 元素, 但可以并列容纳多个 inline 元素

  3).block 元素宽、高、行高等可以更改, inline 元素宽、高、行高等不可更改

  4).应用 inline-block 的元素呈现为内联对象, 周围元素保持在同一行, 但可以设置宽度和高度地块元素的属性(这样可以使用 li + inline-block 制作导航, 而无需 float)

  5).若想将 table 改为 inline 可以是使用 inline-table

2.text-shadow, box-shadow

  text-shadow: 对文字加上阴影效果

  box-shadow: 对容器加上阴影效果

3.box-sizing

  content-box: 只是内容的宽高

  border-box: 内容和边框及补白的总宽高

4.column-count: n 和 display: box 即多栏布局与盒布局之间的区别之间的区别

  多栏布局: 将一个元素的内容平均分为两栏或者多栏, 保证个栏中的内容底部对齐, 各栏宽度必须是相等的, 且不可能指定什么栏中显示什么内容, 所以比较适合文章分栏

  盒布局:

HTML-HTML5+CSS3权威指南阅读(三、CSS3)的更多相关文章

  1. html5+css3 权威指南阅读笔记(三)---表单及其它新增和改良元素

    一.新增元素及属性 1.表单内元素的form属性. html5: <form id="testForm"> <input type=text> </f ...

  2. HTML-HTML5+CSS3权威指南阅读(三、CSS选择器)

    1.伪元素选择器 first-line, first-letter, before, after 2.属性选择器 [attr*=val]: 如果元素的 attr 属性中包含用 val 指定的字符的话, ...

  3. HTML-HTML5+CSS3权威指南阅读(二、让IE支持HTML5标签及对CSS3 Media Query的兼容)

    兼容解决 HTML5是在低版本的浏览器(IE8-)的兼容是有限的,类似很多结构性的标 签<header>.<section>.<footer>等在IE8以下不会被识 ...

  4. HTML-HTML5+CSS3权威指南阅读(一、HTML5与HTML4之间的区别)

    一.HTML5与HTML4之间的区别 1. DOCTYPE 声明 1). HTML4 中为 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T ...

  5. HTML-HTML5+CSS3权威指南阅读(五、设备像素和CSS像素的概念)

    在这个迷你系列的文章里边我将会解释viewport,以及许多重要元素的宽度是如何工作的,比如<html>元素,也包括窗口和屏幕 这篇文章是关于桌面浏览器的,其唯一目的就是为移动浏览器中相似 ...

  6. HTML-HTML5+CSS3权威指南阅读(四、媒体查询)

    1.媒体类型 HTML 4和CSS 2目前支持为不同的媒体类型设定专有的样式表, 比如, 一个页面在屏幕上显示时使用无衬线字体, 而在打印时则使用衬线字体, screen 和 print 是两种已定义 ...

  7. HTML-HTML5+CSS3权威指南阅读(五、深入理解viewport)

    1.手机浏览器与桌面浏览器的不同 现在手机浏览器的显示分辨率与桌面浏览器差不多,但是手机的尺寸比电脑要小很多.一个没做过响应式处理的网站,在手机和电脑上显示完全一样的内容, 不可避免的会出现字体被缩小 ...

  8. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  9. Html5与CSS3权威指南 百度云下载

    Html5与CSS3权威指南 百度云下载 链接:http://pan.baidu.com/s/1hq6Dlvm 密码:php3

随机推荐

  1. 【BZOJ 3309】DZY Loves Math

    http://www.lydsy.com/JudgeOnline/problem.php?id=3309 \[\sum_{T=1}^{min(a,b)}\sum_{d|T}f(d)\mu(\frac ...

  2. Codeforces 850B

    题意: 给出一个序列,两种操作: 1.删除一个数,代价为x 2.给一个数+1,代价为y 求最小代价,使这个序列不为空,且所有的数的gcd>1 n<=5e5,a[i]<=1e6 其实思 ...

  3. 【无源汇有上下界可行流】ACdream1211-Reactor Cooling

    [题意] 给出一些边流量的上界和下界,问能否循环流通. [思路] 黄学长讲得很清楚,直接贴过来: 上界用ci表示,下界用bi表示. 下界是必须流满的,那么对于每一条边,去掉下界后,其自由流为ci– b ...

  4. Highcharts做统计图。

    <script> $(function () { var areasplineData = [[1447916401000,3],[1447918201000,4]]; var typeR ...

  5. [转]解析UML建模语言中的UML图分类、 UML各种图形及作用

    本文向大家介绍一下UML图分类,作为一种建模语言,UML的定义包括UML语义和UML表示法两个部分. UML图大致可分为五类,共有九种图形. AD: 本文和大家重点讨论一下UML图分类,标准建模语言U ...

  6. 学会MySQL索引

    原文:https://mp.weixin.qq.com/s/UzWxJ_pVPjU5ip0Z-Y9TdA 什么是索引? 百度百科是这样描述的: 索引是为来加速对表中数据行中的检索而创建的一种分散的数据 ...

  7. EasyUI datagrid 复选框可以多选但不能全选功能实现

    1.功能需求:  实现多选,但是不能够全选功能 2.js代码 //帮卖列表页面,可以多选但是不能够全选实现 $(".datagrid-header-check").children ...

  8. Wishbone接口Altera JTAG UART

    某些时候,我们在使用Altera FPGA的时候,尤其是涉及SoC系统的时候,通常需要一个串口与PC交互.使用Altera的USB-Blaster免去了外接一个串口.我们可以使用下面所述的IP核通过U ...

  9. unity color space 选取

    https://unity3d.com/cn/learn/tutorials/topics/graphics/choosing-color-space https://docs.unity3d.com ...

  10. MFC【17-3】线程和线程同步化

    17.3小知识点 17.3.1消息泵 编写一个应用程序,让它响应某菜单命令,画几千个椭圆. void CMFC线程View::OnStartDrawing(void) { m_bQuit=FALSE; ...