是否可以在SASS中访问
HTML属性值?
我有一行代码说
我有一行代码说
<ul id="my_id" data-count="3">
其中3是一些jQuery的结果.我需要3来计算一些CSS.如何将其保存为SASS变量?
或者,有没有办法计算某个父元素的子元素数?说我有这个代码:
<ul id="my_id" data-count="3"> <li>First list item</li> <li>Second list item</li> <li>Third list item</li> </ul>
(正如您可能已经猜到的那样,数据计数的值与列表项的数量相匹配.)SASS可以计算列表项并将该数字保存为变量吗?
任何想法将不胜感激.
解决方法
Sass只是一个CSS生成器.它并不真正与您的HTML交互,因此您不能将HTML属性用作Sass变量.
但是,CSS可以根据属性进行选择.所以它会比你想象的更啰嗦,但是你可以做类似的事情
ul[data-count="3"]:after content: "There were three items in that list!"
我认为如果你愿意将自己仅限于最近的浏览器的一部分†,你可以使用CSS calc()函数和attr()在基于CSS的计算中使用该属性.但这是非常前沿的.
†说实话,我不知道哪个版本的浏览器已完全实现了这一点.我很确定Firefox有它,虽然我没有使用它,我不知道其他浏览器.无论如何,它肯定得不到很好的支持.