gpt4 book ai didi

html - 如何将 CSS 中的 HTML 数据属性用作属性?

转载 作者:行者123 更新时间:2023-12-02 04:44:34 26 4
gpt4 key购买 nike

<分区>

如何使用 attr() 选择数据属性并根据该值设置各种 CSS 属性?例如我有这个 jsfiddle http://jsfiddle.net/rh1vfmso/ - 我通过 data-width 设置宽度,然后尝试通过 width: attr(data-width);

设置它

当我将内容设置为属性时它起作用,但没有别的。我如何才能根据 HTML 属性中的设置来设置宽度?

<style type='text/css'>
input[type='checkbox']:checked ~ .size:before {
content: attr(data-width);
display: block;
height: 30px;
background-color: red;
width: attr(data-width);
/*width: 100px;*/
}
</style>

<div>
<input type='checkbox' id='resize'>
<label for='resize'>Resize</label>
<div class="size" data-width=100px></div>
</div>

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com