NotBad_的博客

1、html 属性所带来的问题   1、相同的效果，不同的标签会通过不同的属性来表示   2、使用属性 很不通用，一对一的修改，而不是整体修改2、使用 CSS  来解决上述问题   1、什么是CSS      CSS : Cascading Style Sheet ,层叠样式表,级联样式表,样式表   2、作用      1、实现内容和表现分离      2、提高代

calc()的用法十分巧妙,可以像我们在学校做数学应用题那样列式子来计算长度宽度等值,从而一定程度上实现自适应布局我们想要实现页面自适应布局时，通常因为margin的存在，而比较麻烦；有时候想要实现宽度自适应的输入框时，也因为padding或margin的存在，而相当繁琐，同时由于浏览器兼容性而导致最终效果不一致。css3新添加属性box-sizing，在一定程度上解决了上面的问题，案例：

box-shadow 属性向框添加一个或多个阴影。语法box-shadow: h-shadow v-shadow blur spread color inset;注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可 选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。值描述测

CSS,font-family,好看常用的中文字体2014-10-14例1（小米米官网）：font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;例2（淘宝技术研发中心）：font: 12px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;例3（加网 ）：

Css3引入了新的盒模型——弹性盒模型，该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间。这与XUL（火狐使用的用户交互语言）相似，其它语言也使用相同的盒模型，如XAML 、GladeXML。使用该模型，可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局。本文的例子使用以下的HTML代码：123传统的盒模型基于HTML流在垂直

css3：linear-gradient比如：黑色变成白色.gradient{ background: -moz-linear-gradient(top, #000000 0%, #ffffff 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-s

无标题文档*{ padding:0; margin:0}body,html{ height:100%;}#box{ width:500px; margin:0 auto; outline:1px solid #F00; height:100%;}     要点1：设置box的高度height:100

HTML/CSS]盒子模型，块级元素和行内元素在div+css中，了解块级元素和行内元素还是非常有必要的，比如：对行内元素使用width属性就会失效。虽然自己不是做前端的，但是，在项目中，曾经也弄过从前端布局，也吃过这方面的亏。今天，群里有朋友问起这个，就趁着学习一下，也算是查漏补缺吧，虽然，谈不上精通，但是了解，还是很有必要的。 盒子模型 css盒子模型分为两种，一种

1、转换   1、什么是转换      转换即改变元素的一些状态，大小、位置、形状      可以是2d转换，也可以是3d的转换      2d : 使元素在 x轴和 y轴上发生变化      3d ：2d基础上增加了 z轴的变化   2、转换属性      CSS3转换属性:transform : none / transform-function;none:

1、浮动 元素 对 父层元素带来的影响   影响：一个元素内如果包含了浮动元素，那么该元素的高度可能会变成0。   原因：浮动元素 脱离了 文档流，理论上讲，就不在父层容器内   解决方案:       1、显示设置父层元素的高度       2、通过overflow:hidden 来撑起父层元素的高度************************************

复杂选择器  内容生成  多列  CSSHack(浏览器兼容)1、兄弟选择器   匹配指定元素的相邻兄弟元素   1、相邻兄弟选择器      匹配相邻的元素      匹配当前元素【后面】的【一个】元素，前提两者必须拥有相同父元素      语法：           selctor1+selector2           通过 + 作为结合

1、框模型   1、什么是框模型      框:html中，所有的元素都可以认为是框。框中可以盛装内容。      框模型:指的是 框与框、框与内容之间的关系。      定义了：外边距、内边距、边框      注意：           可以通过width  和   height  定义 框 的宽度和高度  如果  增加了 内边距 外边距 边框 的时候 不会影

本文通过各种实例向大家阐述CSS Grid布局，让我们一起领略其强大的魅力,需要的朋友可以参考下CSS Grid布局对于我等来说就是一个全新的布局，但国外很多同行朋友已对这种布局做了全面的探知。前面花了两篇内容（《CSS Grid布局教程之什么是网格布局》和《CSS Grid布局教程之浏览器开启CSS Grid Layout汇总》）为这篇文章做足了铺垫。或许你想知道的是如何