Как применять правила CSS с помощью attr (data-attribute)?

Я хотел бы иметь CSS, который использует атрибут attr (data-attribute) для применения CSS-правила.Как применять правила CSS с помощью attr (data-attribute)?

Например, в моем CSS:

@media max-width(480px) { 
    .mobile-float { 
    float: attr(data-mobile-float); 
    } 
}

Тогда в моем HTML, я определяю данных-атрибут:

<div data-mobile-float="right"> 
    Floats right on mobile! 
</div> 

<div data-mobile-float="left"> 
    Floats left on mobile! 
</div>

Я чувствую, что не хватает персонажа, и это не за работой. Как это сделать правильно? Благодаря!

источник

2016-05-11 user3621156

вы используете неправильный селектор в CSS попробовать это

[data-mobile-float="left"]{font-size: 50px;}

<div data-mobile-float="right"> 
 
    Floats right on mobile! 
 
</div> 
 

 
<div data-mobile-float="left"> 
 
    Floats left on mobile! 
 
</div>

источник

2016-05-11 04:22:40

Спасибо за предложение, но в вашем примере, теперь вы должны написать еще одно правило CSS для '[-данных мобильных -float = "right"] {...} '. У меня есть много правил CSS, которые я хотел бы добавить, помимо float = left/float = right/@media max-width/@media min-width, и поэтому я хотел бы использовать 'attr()' CSS чтобы обеспечить значение свойства CSS. – user3621156

Как применять правила CSS с помощью attr (data-attribute)?

ответ

Смежные вопросы