いくつかのhtml要素の周りにボックスを入れたいと思います。しかし、このコードは個々の要素をそれぞれ引き起こします。私はボックスの外に必要な要素が他にもあるので、htmlやbody要素を使用したくありません。このCSSの問題を解決するにはどうすればよいですか？
h1, p {
width: 300px;
padding: 50px;
border: 20px solid #0088dd;
text-align: center;}
</style>
</head>
<body>
<p>this should be in the box</p>
<h1>this should be in the box</h1>
<h2> this should not be in the box</h2>
boderを接続するには、周囲の要素が必要です。この場合、あなたのスタイルで本文を次のように使用することができます。
<style type="text/css">
body {
width: 300px;
padding: 50px;
border: 20px solid #0088dd;
text-align: center;}
</style>
警告：ボディータグにボーダーを配置することは、ベストプラクティスのリストには終わりません。今まで！
正しい方法は、ちょうどこのような何かを試してみてくださいクラス
<style type="text/css">
.boxme {
width: 300px;
padding: 50px;
border: 20px solid #0088dd;
text-align: center;}
</style>
</header>
<body>
<div class="boxme">
<p>lol</p>
<h1>Thanks for helping</h1>
</div>
<p>Other text</p>
これを行う方法は他にありますか？私はボックスの外に必要な他の要素があるので、CSS要素としてhtmlやbodyを使用したくありません。 –
はい、私は正しい方法の例を提供しました。 –
を使用することです...あなたは本当に
<div class="border-csl">
<p>lol</p>
<h1>Thanks for helping</h1>
</div>
.border-csl {
width: 300px;
padding: 50px;
border: 20px solid #0088dd;
text-align: center;
}
何を必要としていますか？ –