Расширенный выравнивание по центру - возможно с помощью CSS?

Мне интересно, можно ли выровнять по центру абзац, но каким-то образом не, чтобы все линии были такими же широкими, как и div. Это может быть, например, короче - дольше - короче - дольше или около того.Расширенный выравнивание по центру - возможно с помощью CSS?

enter image description here

Fiddle (не так, как я хочу его): http://jsfiddle.net/u3v6x9fb/

p { 
text-align: center; 
}

источник

2014-10-22 oneday

могли бы вы добавить изображение того, что вы хотите достичь? –

Привет, пожалуйста, будьте более конкретными? Пусть изображение вы можете дать нам http://jsfiddle.net/ с вашим кодом. – hernanvicente

Похоже, вам нужно либо использовать 'white-space: pre', либо hard code разрывы строк. –

Вы можете дать ширину в <p> тега.
Вы также можете вручную применить <br /> линейных разрывов туда, куда вы хотите перейти к следующей строке.
И вы можете сделать 2 класса, например. .pshort & .plong, и примените другую ширину к обоим, и сделайте текст с этими двумя классами.

источник

2014-10-22 11:49:48 Refilon

Я надеялся сделать это более изящным способом, но если это способ сделать это, спасибо, я отвечу на ваш ответ, как только этот параметр активен. – oneday

Просто примените класс к требуемому пункту и центрируйте его.

JSfiddle Demo

CSS

p { 

    text-align: center; 
} 

p.narrow { 
    width:60%; 
    margin: auto; 

}

источник

2014-10-22 11:51:44

Таким образом, я могу сделать только некоторые абзацы целыми, и я хотел сделать каждую вторую строку (или около того) абзаца более узкой. – oneday

@oneday Это невозможно ... CSS не может обнаружить текстовое содержимое. –

Вот один простой способ добавить разрывы строк, где их нужно использовать white-space: pre-line на p элемента.

См ссылка: http://www.w3.org/wiki/CSS/Properties/white-space

По крайней мере, вам не нужно явно добавлять <br> теги или обернуть каждую строку в span или div.

p { 
 
    text-align: center; 
 
    white-space: pre-line; 
 
}

<p>Lorem ipsum dolor sit amet, 
 
consectetur adipiscing elit. Praesent in augue malesuada, tempus odio a, dapibus odio. Vestibulum convallis imperdiet est, sed tincidunt nisi tempus id. Ut quis tempor erat. Vivamus maximus, lectus non auctor iaculis, 
 
ipsum erat sagittis diam, id rutrum justo elit vel neque. 
 
Proin nulla libero, egestas sit amet lorem a, accumsan molestie velit. 
 
Aliquam sed enim quis est rutrum consectetur. Aliquam tincidunt, eros vitae pharetra consectetur, eros tellus aliquet diam, eu auctor orci lectus ut elit. 
 
Nunc eu dui nec ante dignissim pretium.</p>

источник

2014-10-22 11:56:55

Расширенный выравнивание по центру - возможно с помощью CSS?

ответ

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