用html语言制作微博官网,［HTML/CSS］布局学习笔记－用less写微博首页

什么是less

Less 是一门 CSS 预处理语言，它扩充了 CSS 语言，增加了诸如变量、混合(mixin)、函数等功能，让 CSS 更易维护、方便制作主题、扩充。

Less 可以运行在 Node、浏览器和 Rhino 平台上。网上有很多第三方工具帮助你编译 Less 源码。(我用的是koala)

Less 基本语法

变量：

@变量名:变量值；［用法多多，可以多参考文档］

@images: "../img";background: url("@{images}/white-sand.png");

混合：

.classname{//内容}  通过｛.classname;｝可以用在其他css类内编译出来，如果让混合的旨在用在其他元素内编译时，可以在.classname(){} 采用加括号的方式，在使用时加不加括号都一样；

嵌套使用：

.main_classname{ //content1 .child_classname{//content2} }，编译为.main_classname{//content1} .main_classname .child_classname{//content2}

&符号：

表示当前父css类中的名字

&:hover 伪类 选择css父类中的子类 &-ok

导入：

@import “filename.less”,如果是less格式，可以省略不写

其他知识点

1.

Object.style.background=background-color background-image

background-repeat background-attachment background-position

2.元素的上下居中

margin: (@header_height - @search_height - 2)/2 0;

3.less 算数符号间留空格