发表于： 2017-04-01 15:25:13
1 613
学习情况
1、主要看了less,sass好像大同小异。个人理解就是对css代码编写流程的补充和增强，可以直译为css，也可以通过下载引用less.js文件直接网页的渲染。
2、直接使用的webstorm编写less和快捷键转码css，感觉比较简单，好像没有使用各种服务端转码的必要？
3、任务本身比较简单，less发挥的空间也不大，直接单个样式@width:100%等的应用感觉略鸡肋。嵌套、混合、变量带入、函数计算比较方便，整体代码非常直观。
4、任务里面应用实例：
.LoR(@LoR:left){float: @LoR;ext-align: @LoR;width: 4rem;margin:@margin-auto;height: @height;line-height:@height;}
.left{.LoR;}
.right{.LoR(right);}
.center{.LoR;text-align: center;}
head部分，三块分列左中右的代码，修改带入left/right属性即可轻松解决。less中不同单位的计算，参考链接：http://blog.csdn.net/playboyanta123/article/details/50408335
5、插入图片发现一个bug，图片下方多出3px的空隙，由于自己是计算尺寸居中，导致盒子溢出，一直搞不懂原因，各种样式都重置还是不行，一查是bug解决如下：http://www.17css.com/ie-img-3px-bug/。好像也可以margin-bottom:-3px搞定。
问题：
本来想使用引用less文件实现网页，下载less.js文件后，<head>增加代码
<link rel="stylesheet/less" type="text/css" href="./round11.less" />
<script src="./less.js" type="text/javascript"></script>
但是网页一直正常加载less文件，网页显示为无css状态。
计划：后面都是重载之前的任务页面，一方面巩固加强之前的学习情况，另外也熟悉less等的应用。明天任务12初稿。
返回列表
评论