Как решить эту проблему?

Я хочу поместить коробку вокруг некоторых элементов html. Однако этот код вызывает каждый отдельный элемент. Я не хочу использовать элемент html или body, потому что у меня есть другие элементы, которые я хочу за пределами коробки.Как решить эту проблему?

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>

источник

2016-11-26 Anonymous

, что вы действительно необходимо? –

Вам нужен окружающий элемент для присоединения к нему. В этом случае вы можете использовать тело в своем стиле следующим образом.

<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>

источник

2016-11-26 10:54:30

Есть ли другой способ сделать это. Я не хочу использовать html или body как элемент css, потому что у меня есть другие элементы, которые я хочу за пределами коробки. –

Да, я привел пример правильного пути. –

Попробуйте что-то вроде этого ...

<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; 
}

источник

2016-11-26 11:04:32

Как решить эту проблему?

ответ

Смежные вопросы