在我的 nextjs 应用程序中,我在 _app.js 中有一个 Head 标签,如下所示
<GoogleReCaptchaProvider reCaptchaKey={CAPTCHA_SECRET}>
<Head>
<html lang="en"></html>
</Head>
<DndProvider backend={HTML5Backend}>
<HttpsRedirect>
<Fragment>
<Component {...pageProps} />
<ToastContainer />
</Fragment>
</HttpsRedirect>
</DndProvider>
</GoogleReCaptchaProvider>
Run Code Online (Sandbox Code Playgroud)
对于所有页面上的 html 中的 lang 属性,但在我的名为 Layout 的子组件中,它呈现所有页面的组件,我还有一个 Head 标签:
<Head>
<head>
<title>{title}</title>
{inject_divs}
<meta
name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1"
/>
</head>
</Head>
Run Code Online (Sandbox Code Playgroud)
每当我删除 _app.js 中的 Head 时,布局组件中的 Head 标签都会起作用,但是当我将 Head 保留在 _app.js 中时,布局 Head 会被覆盖,有没有办法可以同时使用两者?
我有一个文本编辑器,其中有一个图像工具,它有一个插入功能,可以在左侧和右侧添加边距,但如果您想将图像移到父容器之外,则只有左边距有效,但右边距只是停在边缘容器
.draft-bg {
padding-top: 10px;
padding-bottom: 1px;
}
.image-parent-container {
width: 100%;
height: auto;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
margin: 0rem;
}
.image-parent {
width: 778px;
height: auto;
margin-top: 0px;
margin-bottom: 0px;
}
img {
width: 100%;
height: auto;
margin-right: 1000px;
margin-left: 0px;
}Run Code Online (Sandbox Code Playgroud)
<div class="draft-bg">
<div class="image-parent-container">
<div class="image-parent">
<img src="https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1050&q=80" />
</div>
</div>
</div>Run Code Online (Sandbox Code Playgroud)