Текст CSS под горизонтальным/вертикальным выравниванием

Итак, у меня есть страница с текстом, расположенным по горизонтали и вертикали. То, что я хочу сделать, это поместить обычный текст под этим центральным текстом. Вот мой код.Текст CSS под горизонтальным/вертикальным выравниванием

<html> 
 

 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii"> 
 
<title>Block4o</title> 
 
</head> 
 

 
<body scroll="no" style="overflow: hidden"> 
 

 
<h1>Block4o</h1>       
 
Normal text should be here (links etc.) 
 
</body> 
 
</html> 
 

 
<style> 
 
body 
 
{ 
 
\t background-image: url("/background.jpg"); 
 
\t background-repeat:no-repeat; 
 
\t -webkit-background-size:cover; 
 
\t -moz-background-size:cover; 
 
\t -o-background-size:cover; 
 
\t background-size:cover; 
 
\t background-position:center; 
 
} 
 

 
h1 
 
{ 
 
\t position: fixed; 
 
\t top: 50%; 
 
\t left: 50%; 
 
\t transform: translate(-50%, -50%); 
 
\t border:solid; 
 
\t border-size: 8px; 
 
\t border-radius: 10px; 
 
} 
 

 
</style>

Вот пример того, что мне нужно визуально. Любая помощь приветствуется.

источник

2016-05-09 Block4o

Что-то вроде этого?

.main{ 
 
\t position: fixed; 
 
\t top: 50%; 
 
\t left: 50%; 
 
\t transform: translate(-50%, -50%); 
 
} 
 

 
h1{ 
 
    border:solid; 
 
\t border-size: 8px; 
 
\t border-radius: 10px; 
 
}

<div class="main"> 
 
    <h1>Block4o</h1>  
 
    Normal text should be here (links etc.) 
 
</div>

источник

2016-05-09 20:22:21

Надеется, что это помогает:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii"> 
<title>Block4o</title> 
<style> 
    body { 
     background-image: url("/background.jpg"); 
     background-repeat: no-repeat; 
     -webkit-background-size: cover; 
     -moz-background-size: cover; 
     -o-background-size: cover; 
     background-size: cover; 
     background-position: center; 
    } 

    h1 { 
     text-align: center; 
     border: solid; 
     border-size: 8px; 
     border-radius: 10px; 
    } 

    div { 
     position: fixed; 
     top: 50%; 
     left: 50%; 
     transform: translate(-50%, -50%); 
    } 
</style> 
</head> 
<body scroll="no" style="overflow: hidden"> 

<div> 
    <h1>Block4o</h1> 
    Normal text should be here (links etc.) 
</div> 

</body> 
</html>

источник

2016-05-09 20:22:47

Текст CSS под горизонтальным/вертикальным выравниванием

ответ

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