The ~"value"
syntax for value escaping can be used to assign a value to a property that is not recognized by Less. Less only accepts a valid CSS syntax for property values.
For this recipe, you will have to create a gradient.less
file and an index.html
file, which load the Less file and less.js
compiler with the following code in the head
section:
<link rel="stylesheet/less" type="text/css" href="gradient.less"> <script src="less.js" type="text/javascript"></script>
Write the following Less code into your
gradient.less
file:.gradient { background-image:linear-gradient(to bottom, red, yellow); background-repeat: repeat-x; filter: ~"-progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffff0000', EndColorStr='#ffffff00')"; }
Add some
header
elements to yourindex.html
file, as follows:<header><h1>Page header</h1></header> <section><header><h2>Article header...