Question

我一直在玩获取HTML文档以A4尺寸显示，并使用此codepen中的代码完美运行：

https://codepen.io/rafaelcastrocouto/pen/LFAes

CSS

body {
  background: rgb(204,204,204); 
}

page {
  background: white;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5cm;
  box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
  }

page[size="A4"] {  
  width: 21cm;
  height: 29.7cm;
}

HTML

<page size="A4"></page>

但是，我不确定如何或为何在CSS中声明页面和页面[大小信息]允许您在HTML中使用该标记。事实上，我可以在任何地方找到对HTML页面标记的任何引用。

有人可以解释一下代码在codepen中是如何工作的吗？提前致谢

Answer 1

我不相信<page>是一个实际的HTML元素。

当浏览器看到这个时，它可能认为它已经老了，并且错过了浏览器发布时不存在的新发明。

在这种情况下，它被视为<div>，CSS规则仍然适用。

但实际上最好坚持真正存在的元素，而不是假装它们将来某一天，因为将来新创建的标签的实现可能与您期望的不同。

用CSS <div class="page" data-size="A4">和div.page编写div.page[data-size="A4"]本来会更好。

Answer 2

它不是HTML。这只是利用了这样一个事实：为了便于将来扩展该语言，浏览器允许使用CSS和JS来定位未知元素。

Answer 3

您可以阅读有关HTML5标记HERE

的信息

如果您想使用HTML5，则应将<page></page>替换为<div>或<section>。页面标签不存在！

使用它可以使用

设置HTML样式

section { "your style" } section[size="A4"] { "your style" }

HTML - 什么是<page>标签？

3 个答案: