Html в одну строку как исправить

Как вывести термин и определение в одну строку?

В списке определений термин и его определение вывести на одной строке.

Решение

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

Для выравнивания содержимого тегов используется свойство float со значением left , добавляемое к селектору DT . Добавляя одновременно ширину через width добиваемся того, что элементы выравниваются и по вертикали. В примере 1 создаётся форма, в которой текст и поля располагаются на одной строке. В качестве модульной сетки применяется список определений, при этом текст находится внутри тега , а поле внутри .

Пример 1. Вывод в одну строку

HTML5 CSS 2.1 IE Cr Op Sa Fx

         
Имя
 
Пароль
  

Результат данного примера показан на рис. 1. Поля формы немного смещены вниз, поэтому в примере они поднимаются вверх с помощью свойства top с отрицательным значением. Минимальная высота min-height нужна для пустого тега , чтобы он занимал нужный размер.

Рис. 1. Использование списка определений для формы

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Популярные рецепты

• Как добавить картинку на веб-страницу?
• Как добавить иконку сайта в адресную строку браузера?
• Как добавить фоновый рисунок на веб-страницу?
• Как сделать обтекание картинки текстом?
• Как растянуть фон на всю ширину окна?
• Как выровнять фотографию по центру веб-страницы?
• Как разместить элементы списка горизонтально?
• Как убрать подчеркивание у ссылок?
• Как убрать маркеры в маркированном списке?
• Как изменить расстояние между строками текста?
• Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
• Как открыть ссылку в новом окне?

Как разместить два слова на одной строке, чтобы одно выравнивалось по левому краю, а второе по правому?

Для решения задачи существует несколько способов, из которых мы рассмотрим два. Первый, в каком-то смысле традиционный, основан на таблицах, а второй использует слои и стили.

Использование таблиц

Пример 1. Выравнивание текста с помощью таблицы

HTML5 CSS 2.1 IE Cr Op Sa Fx

        
Текст слева
 
 
  

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

Использование стилей

Чтобы расположить два разных текста на одной строке применяется стилевое свойство float со значением left . Исходно float предназначался для создания обтекания вокруг элемента, но в последствии стал активно использоваться при верстке слоев, в частности при создании колонок. С той же целью воспользуемся им и мы. Для этого создаём два класса leftstr и rightstr , для которых установим ширину 50% и обтекание по левому краю ( float: left ). Выравнивание текста по правому краю для правого слоя задаётся стилевым свойством text-align со значением right (пример 2).

Пример 2. Положение текста

HTML5 CSS 2.1 IE Cr Op Sa Fx

В данном примере стилевые классы leftstr и rightstr добавляются к абзацу текста. Свойство float действует не только на текущий элемент, но и близлежащие к нему элементы. Поэтому после создания нужных строк следует отменить действие float с помощью свойства clear .

Как сделать HTML в одну строку

Здравствуйте. Поднимаю эту тему потому-что так и не смог найти решения. Есть сайт Сайт Нужно сделать хтмл в одну строку, этого требует заказчик вот и мучаюсь. Пробовал ставить модуль minify. Действительно убирает некоторые переносы. Пробовал сделать как написано в Issue Всё содержимое body стало в одну строку. Но содержимое в head по прежниму с переносами. Такого же результата добился используя решение

Заменить вывод print $page;

$output = str_replace(array(«\r\n», «\r»), «\n», $page);
$lines = explode(«\n», $output);
$new_lines = array();

foreach ($lines as $i => $line) if(!empty($line))
$new_lines[] = trim($line);
>
?>
print implode($new_lines);
?>

Если кто-нибудь сталкивался с такой задачей помогите пожалуйста уже неделю мучаюсь. Возможно можно что то сделать с шаблоном html.tpl.php применить функцию str_replace ко всем строкам и массивам.

• Drupal7
• Есть вопрос

• Блог
• Войдите или зарегистрируйтесь, чтобы отправлять комментарии

Комментарии

Plazik 25 августа 2014 в 20:21
«chedia» wrote:

Возможно можно что то сделать с шаблоном html.tpl.php применить функцию str_replace ко всем строкам и массивам.

Вы на верном пути, так и надо делать.

• Войдите или зарегистрируйтесь, чтобы отправлять комментарии
• Реакции

Я только начинаю изучать php поэтому не понимаю что нужно сделать. В шаблоне есть 4 массива и несколько строк. Я так понимаю всё нужно собрать в один массив, а потом пропустить через функцию str_replace, но как это сделать?

• Войдите или зарегистрируйтесь, чтобы отправлять комментарии
• Реакции

Приведите пример вашего кода.

• Войдите или зарегистрируйтесь, чтобы отправлять комментарии
• Реакции

$output = str_replace(array(«\r\n», «\r»), «\n», $page);
$lines = explode(«\n», $output);
$new_lines = array();

foreach ($lines as $i => $line) if(!empty($line))
$new_lines[] = trim($line);
>
?>
print preg_replace(‘/\s+/’, ‘ ‘, implode($new_lines));

• Войдите или зарегистрируйтесь, чтобы отправлять комментарии
• Реакции

Решение пока не нашёл. Подключил скрипт Dynamic Website Compressor, но он не работает с boost.

• Войдите или зарегистрируйтесь, чтобы отправлять комментарии
• Реакции

Как привести код из одной длинной строки в читаемый вид?

Доброго времени суток друзья, имеется файлы css и xml, где весь код в одну строчку помещен.
Есть ли какие-либо сервисы, которые делают читаемый вид из таких файлов ?
Структурируют адекватно теги, чтобы можно было его нормально читать.

Заранее большое спасибо.

• Вопрос задан более трёх лет назад
• 24037 просмотров

1 комментарий

Простой 1 комментарий