Какой тег CSS создает такую коробку с заголовком?

Я хочу создать такую коробку с заголовком:

CSS box with title

Может кто-нибудь, пожалуйста, дайте мне знать, если для этого есть тег по умолчанию CSS? Или мне нужно создать свой собственный стиль?

Ответы на вопрос(7)

ктируемой форме, вы можете сделать это с помощью следующего кода:

<div class="title_box" id="bill_to">
    <div id="title">Bill To</div>
    <div id="content">
        Stuff goes here.<br>
        For example, a bill-to address
    </div>
</div>

И в файле CSS

.title_box { 
    border: #3c5a86 1px dotted; 
}

.title_box #title { 
    position: relative; 
    top : -0.5em;
    margin-left: 1em;
    display: inline; 
    background-color: white; 
}

.title_box #content {
}

Я рекомендую вам использовать div с отрицательным полем-h1 внутри. В зависимости от семантической структуры вашего документа, вы также можете использовать набор полей (HTML) с одной легендой (HTML) внутри, которая примерно выглядит по умолчанию.

 Mozammel22 сент. 2008 г., 09:44
Спасибо да ты прав! Я искал вариант поля / легенды. Спасибо

.fldset-class {
    border: 1px solid #0099dd;
    margin: 3pt;
    border-top: 15px solid #0099dd
}

.legend-class {
    color: #0099dd;
}
<fieldset class="fldset-class">
    <legend class="legend-class">Your Personal Information</legend>

    <table>
        <tr>
            <td><label>Name</label></td>
            <td><input type='text' name='name&apo,s;></td>
        </tr>
        <tr>
            <td><label>Address</label></td>
            <td><input type='text' name='Address'></td>
        </tr>
        <tr>
            <td><label>City</label></td>
            <td><input type='text' name='City'></td>
        </tr>
    </table>
</fieldset>

http://www.pixy.cz/blogg/clanky/css-fieldsetandlabels.html

<form>
  <fieldset>
  <legend>Subscription info</legend>
    <label for="name">Username:</label>
    <input type="text" name="name" id="name" />
    <br />
    <label for="mail">E-mail:</label>
    <input type="text" name="mail" id="mail" />
    <br />
    <label for="address">Address:</label>
    <input type="text" name="address" id="address" size="40" />
  </fieldset>
</form>


<style type="text/css">
fieldset { border:1px solid green }

legend {
  padding: 0.2em 0.5em;
  border:1px solid green;
  color:green;
  font-size:90%;
  text-align:right;
  }
</style>

<fieldset class="fldset-class">
    <legend class="legend-class">Your Personal Information</legend>

    <table>
        <tr>
            <td><label>Name</label></td>
            <td><input type='text' name='name'></td>
        </tr>
        <tr>
            <td><label>Address</label></td>
            <td><input type='text' name='Address'></td>
        </tr>
        <tr>
            <td><label>City</label></td>
            <td><input type='text' name='City'></td>
        </tr>
    </table>
</fieldset>

DEMO

Решение Вопроса

Я полагаю, что вы ищетеfieldset HTML-тэг, который затем можно стилизовать с помощью CSS. Например.,

<fieldset style="border: 1px black solid">

<legend style="border: 1px black solid;margin-left: 1em; padding: 0.2em 0.8em ">title</legend>

Text within the box <br />
Etc
</fieldset>
 11 февр. 2016 г., 10:38
Это была хорошая информация
 22 сент. 2008 г., 14:19
Стоит отметить, что наборы полей должны использоваться только для форм.
 22 сент. 2008 г., 10:09
Вы должны скопировать этот точный HTML-код в своем ответе (в дополнение к вашему HTML-исходному коду уже там). Этот код будет интерпретирован и отображен в этом посте, и это показывает, что он работает именно так, как рекламируется. Я пока не могу редактировать ваше сообщение, чтобы сделать это ...
 22 сент. 2008 г., 11:17
Он допускает только базовый буквальный HTML, так что, вероятно, тег fieldset не разрешен или что-то в этом роде
 22 сент. 2008 г., 10:31
VonC, я пытался сделать это, но он удалил весь мой HTML. Оставив только мой текст.

<head>
    <title></title>
    <style type="text/css">
        legend {border:solid 1px;}
    </style>
</head>
<body>
    <fieldset>
        <legend>Test</legend>
        <br /><br />
    </fieldset>
</body>

Ваш ответ на вопрос