Less里css表达式的写法示例介绍

   2015-11-08 0
核心提示:这篇文章主要介绍了Less里css表达式的写法,需要的朋友可以参考下。修复IE6的fixed,IE7+已经支持了
项目中用的grunt-contrib-less, 写了以下less代码

复制代码
代码如下:

.mapfix{
position: fixed;
top:10px;
width: 430px;
z-index: 100;
background: #fff;
-position:absolute;
-top:expression(eval(document.documentElement.scrollTop));
}

注意底部两行是为了兼容IE6,即修复IE6的fixed。IE7+已经支持了。

执行less命令后,报错
Less里css表达式的写法示例介绍 
开始以为是less不支持IE css hack,后发现是IE css 表达式的问题,仕龙同学告知解决方法

复制代码
代码如下:

-top: ~"expression(eval(document.documentElement.scrollTop+10));";

前面加个波浪号,后面用双引号括起来。这时编译通过。
 
标签: less css表达式
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • React 如何适用less
    1.使用 create-react-app 创建的项目,默认情况下是看不到 webpack 相关的配置文件,我们需要给它暴露出来,使用下面命令即可:npm run eject2.添加lessnpm install less less-loader --save-dev3.修改webpack配置文件 (修改下面两段代码即可)const cssRege
    03-08
  • React , TypeScript,  CSS Module , Less , Antd 遇到的坑
    React , TypeScript, CSS Module , Less , Ant
    因为React 本身的脚手架自身在webpack中已经做了对CSS Module 的配置,因最近遇到了很多坑,所以从头整理了一遍 使用版本"react": "^16.13.1","antd": "^4.4.0","typescript": "~3.7.2","webpack": "4.42.0","less": "^3
    03-08
  • Create React App 支持 Less Modules 的配置说
    Create-React-App 版本:v4.0.11. 未执行yarn eject的情形下@craco/craco(Create React App Configuration Override - 配置扩展库)版本:v5.8.0 craco.config.js配置文件代码内容如下:const CracoLess = require('craco-less');const CracoAntDesign
    03-08
  • create-react-app初始化报错及配置less
    官方文档我擦咧,新建的文件夹不见了//报错warning There appears to be trouble with your network connection. Retrying... error An unexpected error occurred: "http://10.1.10.33:8082/@timer%2fdetect-port: no such package available". info If you
    03-08
  • gulp自动化构建工具--自动编译less为css--学习
     1.安装      命令:npm install gulp-less 或者 cnpm install gulp-less2.编写文件 //获取gulpvar gulp = require('gulp')//获取gulp-less模块var less = require("gulp-less")//编译less//在命令行输入gulp less启动此任务gulp.task('less',function(){
    03-08
  • CSS(七)前端预处理技术——Less css预处理器面试题
    CSS(七)前端预处理技术——Less css预处理器
      1、简介:    Less是一种动态样式语言,Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展。    Less 将 CSS 赋予了动态语言的特性,如 变量, 继承, 运算, 函数。LESS 既可以在 客户端
    03-08
  • CSS语言扩展-Less css扩展属性
    Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展。Less 可以运行在 Node 或浏览器端。例如:@base: #f938ab;.box-shadow(@style, @c) when (iscolor(@c)) {-webkit-box-shadow: @style @c;box-shadow:
    03-08
  • webpack(5)配置打包less和sass webpack打包lib
    1.打包less需要下载包less和less-loader:npm install less less-loader -D2.打包sass需要下载包node-sass和sass-loader:npm install node-sass sass-loader -D3.在(4)的基础上新增一个index.less文件:@width:200px;@height:200px;@color:green;#box1{
    03-08
  • 记一次webpack打包样式加载问题 webpack打包less
    记一次webpack打包样式加载问题 webpack打包les
    今天是周六.我过来加班了.是因为一个属性问题.俗话说一杯茶一包烟一个bug改一天感觉这句话就是特意为我准备的(我加班的时候喝奶茶,抽烟,而且就一个bug.哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或
    03-08
  • 配置webpack3.6.0处理css、less、es6、图片文件、vue
    配置webpack3.6.0处理css、less、es6、图片文件
    首先配置webpack的基本配置,包括entry( 入口)、output(出口):(创建webpack.config.js文件放置所有的webpack的配置)接下来是配置命令:  module.exports={entry:"",output:{    path:"",(写绝对路径,打包后的输出文件,一般通过node的path以及path.r
    03-08
点击排行