看《css知多少》的一些总结】的更多相关文章

问题 1.有些浏览器不完全支持css3,现在可以用哪个工具去检测浏览器是否支持,以及支持哪些项? modernizr:检测浏览器对HTML5和CSS3特性(至于modernizr的介绍,可以看我另外一篇博文HTML5系列四(特征检测.Modernizr.js的相关介绍)) 2.常用的html标签,它们的display属性一般默认为block和inline.有哪些常用标签的display不是block和inline,这些标签显示的时候和block/inline有何区别? 具体display属性值有…
一.position定位常见属性 对于属性position来说,属性值有static/relative/absolute/fixed/inherit以下只对绝对定位position:absolute详述说明 看栗子 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>绝对定位position:absolute<…
<css知多少>系列就此完结了.常来光顾的朋友可能会觉得突然:css的知识点还有很多,怎么突然就完了,还没讲完呢?这样说是对的.不过凡事都有一个定位,如果盲目求多,定位模糊,那样就没有目的没有方向了. 我的身份不是前端开发人员,而是产品经理.我规划的产品是一款项目管理软件,我也是一个PMP.我深知一个项目一定要有目标.范围.进度和质量要求.一旦达到,项目即可结束,准备下一个项目的启动.我接下来,要继续优化我的富文本编辑器wangEditor.还要把我之前写的<深入理解javascript…
上一节<css知多少(2)——学习css的思路>有几个人留言表示思路很好.继续期待,而且收到了9个赞,我还是比较欣慰的.没看过的朋友建议先去看看上一节. 这一节就开始实践上一节的思路! 1. “层叠”的概念 CSS——层叠样式表,其中的“层叠”是什么意思呢?层叠就是浏览器对多个样式来源进行叠加,最终确定结果的过程.举一个简单的例子: 上图中有两个样式来源,第一个是引用的css1.css,第二个是自己在style中编写的样式.“层叠”是个叠加的过程,可通过下图表示: 上面用一个简单的例子来说明了…
上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面的两层中,用户自定义样式一般也就是改一改字号大小和字体样式,也没甚好说的.而最有的说的就是浏览器的默认样式. 不同浏览器的默认样式多少有些区别,特别是老版本的浏览器之间,现在高级浏览器越来越向统一的标准靠拢,对前端程序猿来说是一件好事情.虽然有些许差异,但是绝大部分还是相同的,我先把代码粘贴出来 ,具体的解读咱们慢慢道来(只说重点,比较容易的或者不常用的…
1. 引言 从这一节开始,我们就进入本系列的第三部分——css呈现.本部分将描述css在页面的几种布局和呈现的特性.包括两类:文字.块. 第一类——文字.这部分相对比较简单一些,例如设置字号.字体.颜色.背景色.是否加粗等.重点的地方在于设置字体.设置行高.文字相关的距离都用相对值,这些东西在<css知多少(4)——解读浏览器默认样式>那一节已经说过了.另外还有一个重点,就是web端最流行的字体库fontAwesome,关于它我之前有一篇文章专门讲过,请参见<请用fontAwesome代…
<css知多少>系列就此完结了.常来光顾的朋友可能会觉得突然:css的知识点还有很多,怎么突然就完了,还没讲完呢?这样说是对的.不过凡事都有一个定位,如果盲目求多,定位模糊,那样就没有目的没有方向了. 我的身份不是前端开发人员,而是产品经理.我规划的产品是一款项目管理软件,我也是一个PMP.我深知一个项目一定要有目标.范围.进度和质量要求.一旦达到,项目即可结束,准备下一个项目的启动.我接下来,要继续优化我的富文本编辑器wangEditor.还要把我之前写的<深入理解javascript…
css知多少(11)——position   1. 引言 本文将用一篇文章介绍position(定位),在学习position之前,我们应该去思考一个问题:什么情况下我们需要定位?如果没有定位将无法满足我们怎样的需求?我们要知道,被人类创造出来的每一个知识,都有它的用途,都要解决一些之前遇到的问题. 如果没有定位,我们做出来的网页将会是按部就班的自上而下.自左而右的平铺在浏览器上,外加通过margin和padding调整一下间距,还有就是通过float来浮动某些元素.做一些简单的网页这样就够了,…
css知多少(9)——float下篇   float内容比较多,咱们分上.下两篇来介绍,上篇已经写完,这是下篇.建议大家先把上篇看了,再来看下文,精彩内容不要掠过啊. 1. 清除float <上篇>中我们提到,float具有“破坏性”,它会导致父元素“坍塌”,这将不是所要看到的.如何去避免float带来的这种影响呢(也就是我们常说的“清除浮动”) ?方法有很多种,我在这里介绍4中供大家参考,大家可根据实际情况来选择. 先介绍两个比较简单,但是不常用的解决方法: 为父元素添加overflow:h…
css知多少(10)——display   1. 引言 网页的所有元素,除了“块”就是“流”,而且“流”都是包含在“块”里面的(最外层的body就是一个“块”).在本系列一开始讲<浏览器默认样式>的时候,大家也都看到了浏览器默认样式中规定了html元素哪些属于“块”(剩下的就是“流”).这部分知识非常重要也非常基础,因此在所有的前端面试题中,都会问道哪些元素是“块”哪些元素是“流”. 其实,这部分知识都囊括在display这个样式设置中.在网上查找出display所有的属性,你会发现它有很多,…