html语言难不难,css难不难？

CSS(全称Cascading Style Sheets，层叠样式表)是一种用来表现HTML或XML等文件样式的计算机语言；用来表示html样式的一种编程语言，目前css的最新版本是css3，css是可以做到网页和内容进行分离的一种样式语言。

CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS难不难？

css入门容易，想学深挺难，精通更难；学习css需要多加练习。

在调试CSS的时候，常常会出现属性互相影响的情况，like this

为什么？——没有规律，不正交

怎么学？——背文档 or 试

margin和border

1、兄弟元素之间的margin会合并在两兄弟间添加一个元素，给该元素加一个border，margin会分开

示例：http://jsbin.com/zapapaq/edit?html,output

在两兄弟间添加一个元素，给元素设置display:table/flex属性，margin会分开

示例：http://jsbin.com/nivulepiku/edit?html,output

2、父子元素之间的margin合并

示例：http://jsbin.com/poqeqag/13/edit?html,output子元素margin和父元素border/padding会相互影响

子元素margin和父元素display/overflow会相互影响

小圆点和display

示例：http://jsbin.com/favewir/1/edit?html,output

元素默认display: list-item，如果将其display设为其它值，则小圆点就消失了。

position: absolute和display: inline

示例：http://jsbin.com/tuvilec/1/edit?html,output

可以看到display设置成inline的元素，在使用绝对定位后计算出来block(补充：inline-block也会变为block，如果使用inline-flex则会变成flex，说明只要使用了position: absolute，任何display设置有inline的都会被转换)

transform和position: fixed

示例：

float和文字

示例：

float最初的设计目的是为了图文混排，因此文字会感知float元素，但float对其它元素位置不会产生影响，因为float元素脱离了文档流。而使用position: absolute的元素也脱离了文档流，但其它盒子和文本都会忽略它。

更多web前端知识，请查阅 HTML中文网 ！！