Question

我的应用程序是ReactJS，我想为Seo优化添加一个“ h1”标签。这是我的代码：

{showHeader &&
    <Col xs={12} sm={12} style={{textAlign: 'center', minWidth: '130px', paddingTop: "15px"}}>
        <div className="headerTitle">
            <p className='purple'><Translate value={TEXT} dangerousHTML/>
            </p>
        </div>
    </Col>
}

所以，每次我把它放到哪里都没关系。col，div，p ...之间的标题变大或没有响应。它说x1和ms不允许在h1中使用。我尝试类似<h1 xs={12}的方法 ...我也尝试过CSS，但无法正常工作（可能是我不知道怎么做）。.我想做出响应，一词在彼此之下，聚集而不离开模板。字体大小也减小了。我想保存我的功能，但要具有h1标签。如果可能的话，最好不要安装软件包。

Answer 1

Col xs = 12表示div将获得宽度的100％ Col xs = 6表示div将获得宽度的50％

但是

<Col xs={12}>
  <h1> demo </h1>
</Col>

和

<Col md={6}>
  <h1> demo </h1>
</Col>

将具有相同的 h1字体大小，是的，col可修改宽度，但不是是字体大小。

为此，您将需要媒体查询（将其添加到CSS文件中）：

@media only screen and (max-width: 600px) {
  h1 {
    font-size: 12px;
  }
}

如有疑问，请在此处

h1标签如何获取属性以使其具有响应能力-ReactJS

1 个答案: