HTML текст позиции в центре - PullRequest
Новая
       1

HTML текст позиции в центре

0 голосов
/ 04 мая 2018

У меня есть обычный текстовый код, который просто отображает код. Но я хочу сделать так, чтобы ХУДОЖНИК остался посередине, как мне это сделать? 

<div class="content">

  <b><p style="font-size:18px;line-
    height:10px;color:black;">SONGNAME</b> <br /></div>
<p style="font-size:18px; color:#FF2C55; line-height:0;">ARTIST<br/>
  </div>

Я попробовал положение: исправлено; осталось: 50% не сработало. Я знаю, что есть много примеров по этому поводу, но я не могу найти похожий код для моего.

Ответы [ 3 ]

0 голосов
/ 04 мая 2018

Добавьте text-align: center в ваш элемент ARTIST. 

<p style="font-size:18px; color:#FF2C55; line-height:0; text-align: center;">ARTIST</p>

Вам также не хватает закрывающего тега в элементе SONGNAME. Вы также можете покончить с вашими тегами br, потому что div по своей сути являются блочными элементами.

0 голосов
/ 04 мая 2018

Добавить 'text-align: center;' атрибуту стиля элемента, содержащего текст, который вы хотите центрировать. Пример: 

<html>
<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
</head>
<body>
<div class="content">

<b><p style="font-size:18px;line-
height:10px;color:black;">SONGNAME</b> <br /></div>
<p style="font-size:18px; color:#FF2C55; line-height:0; text-align:center;">ARTIST<br/>    
</div>

</body>
</html>
0 голосов
/ 04 мая 2018

Выровняйте текст для художника по центру. В вашем html также были проблемы с тегами. 

#artist{
  text-align: center;
}
<html>
<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
</head>
<body>
<div class="content">

<b><p style="font-size:18px;line-
height:10px;color:black;">SONGNAME</b> <br /></div>
<div id = 'artist'>
<p style="font-size:18px; color:#FF2C55; line-height:0;">ARTIST<br/>    
</p>
</div>
 </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...