是否可以在不使用JavaScript的情况下更改html内容？

Question

我有一个只使用HTML和CSS的项目.是否可以使用浏览器更改某些事件上HTML元素的内容,就像使用JavaScript".innerHTML"但只使用CSS一样.

例如使用 @media screen and(..)

即使删除当前的类名并在窗口重新调整大小上附加另一个类也是合适的.

Answer 1

它完全取决于您想要触发更改的操作,但总的来说,是的,这是可能的.

这是一个基于宽度的示例:

HTML

<div id="something-awesome"></div>

CSS

#something-awesome {
  &:before {
    content: "This is some great text here.";
  }
}

@media (min-width: 500px) {
  #something-awesome {
    &:before {
      content: "This is some other super great text.";
    }
  }
}

这是一个小提示,以显示该示例如何工作:https://jsfiddle.net/ttLc7a4t/2/

更改输出框的宽度以查看其运行情况.