Переключатель и метка с тегом <xmp>для отображения в одной строке (только с использованием HTML) - PullRequest
Новая
       0

Переключатель и метка с тегом <xmp>для отображения в одной строке (только с использованием HTML)

0 голосов
/ 12 февраля 2019

Я хочу, чтобы мои переключатели и метка были в одной горизонтальной линии.Я использую тег xmp для отображения необработанного HTML как опции с переключателем.Но текст в xmp начинается с новой строки.Есть ли альтернатива тегу xmp. 

       `<input class="answer" type="radio" name="q3" value="0">
        <label><xmp>The <head> section</xmp></label>
        <br></br>
        <input class="answer" type="radio" name="q3" value="1">
        <label><xmp>Both <head> section and the body section are 
        correct</xmp></label>
        <br></br>
        <input class="answer" type="radio" name="q3" value="0">
        <label><xmp>The <body> section</xmp></label>
        <br></br>
        <input class="answer" type="radio" name="q3" value="0">
        <label>None of these</label>`

Вот как выглядит графический интерфейс

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Имейте в виду:

Элемент использовался для окружения примера HTML-текста, который должен отображаться без интерпретации каких-либо элементов HTML между открывающими и закрывающими тегами . Элемент устарел в HTML 3.2 и теперь устарел. предназначен для отображения содержимого точно в том виде, в котором он напечатан, без сжатия пробелов.

Вместо этого следует использовать &lt;для тега меньше чем, и &gt; для тега, более понятного, если требуется, чтобы метки содержали нефункциональные теги HTML: 

<input class="answer" type="radio" name="q3" value="0">
<label>The &lt;head&gt; section is here</label>
<br />
<input class="answer" type="radio" name="q3" value="1">
<label>2nd section goes here</label>
<br />

, что дает:

output

Обратите также внимание, что <br></br> можно кратко обозначить как: <br />, хотя они не очень подходят для размещения элементов на странице, хотя я думаю, что это выходит за рамкиэтого вопроса.

Полный список доступных символов можно найти здесь .

0 голосов
/ 13 февраля 2019

Вероятно, стоит взглянуть на документацию формы Bootstrap .

Чтобы включить Bootstrap, достаточно просто вставить это в раздел head вашего документа: 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha256-azvvU9xKluwHFJ0Cpgtf0CYzK7zgtOznnzxV4924X1w=" crossorigin="anonymous" />

Тогда вы можете просто поиграть с примерами в документах.

Например, вот форма для входа, представленная красиво: https://jsfiddle.net/h4sdpqtg/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...