Мертвый центр для вывода JavaScript - PullRequest
Новая
       16

Мертвый центр для вывода JavaScript

0 голосов
/ 09 февраля 2009

Я собираюсь заранее извиниться за базовый вопрос, но я впервые использую javascript в html.

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

HTML 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>home</title>

<link href="style.css" rel="stylesheet" type="text/css" />

</head>


<body>

<div id="horizon">
<div id="content">

<script type="text/javascript" src="scripts.js"></script>

</div>
</div>

</body>

CSS 

#horizon 
{
color: white;
background-color: #ffffff;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
height: 1px;
overflow: visible;
visibility: visible;
display: block
}

 #content 
{
font-family: Helvetica, Geneva, Arial, sans-serif;
font-color: black;
background-color: white;
margin-left: -410px;
position: absolute;
top: -237px;
left: 50%;
width: 825px;
height: 475px;
visibility: visible
}

Ответы [ 3 ]

1 голос
/ 09 февраля 2009

Хорошо, для начала, вам не хватает ваших HTML-тегов. Вам необходимо заключить HTML-код между тегами HTML.

Во-вторых, вам нужно будет установить другой цвет текста в качестве фона. В вашем CSS вам нужно изменить цвет #horizon на черный или что-то еще.

Кроме этого, ваш код работает.

1 голос
/ 09 февраля 2009

1001 * попробовать * 

#content 
{
    margin: auto;
    width: 200px; /* however wide it should be (required) */
}

...
<div id="content">
    stuff goes here from js / whatever
</div>

для вертикального выравнивания вы смотрите на JS, а не на CSS.

0 голосов
/ 09 февраля 2009

Как насчет использования text-align: center?: 

#content 
{
font-family: Helvetica, Geneva, Arial, sans-serif;
font-color: black;
background-color: white;
text-align: center;
}
...