HTML начинающий кодирование с помощью блокнота

Привет, я изучаю медиа-разработку и у меня есть вопрос. Я поместил предложение в мой HTML-файл, но он не будет отображаться при открытии файла в браузере.

<!doctype html>

<html lang="nl">

<head>

    <meta charset="utf-8" />

    <style type="text/css">
    #naam      {
                font-weight: bold;
              }
        #schuin    {
                font-style: italic;
              }
    #centreren {
        text-align: center;
          }

        </style>

    <title>
    opgave 3.1 Stijn Bastiaansen
</title>

</head>

    <body>
    Dit is mijn eerste website.

        <p> Mijn naam is: <span id="naam"> Stijn Bastiaansen. </span> </p>

        <p> <span id="schuin"> Ik volg deze opleding aan het ICT-Lyceum van het Roc Tilburg. </span> </p>

        <p> <span id="centreren> Tekst centreren </span> <p>

        <p align="right"> of rechts uitlijnen </P> 

        <p>kan ik ook al.

    </body>

</html>

Браузер не показывает текст центра

4 ответа

Прежде всего: <span> элемент не будет соответствовать всей ширине линии, поэтому (если он не имеет фиксированной ширины) он не будет отображать центрированный текст (потому что его ширина в точности равна ширине текста / содержимого).

Просто примените стиль к элементу, который будет охватывать всю ширину линии (например, <p>):

<p id="centreren"> Tekst centreren</p>

Это не влияет на рендеринг такого простого примера (потому что браузеры довольно легко работают с HTML), но есть и другие ошибки, на которые стоит обратить внимание:

  • Ценность id атрибут для centreren не заключены в кавычки, они являются необязательными (и даже если большинство современных браузеров их разбалансируют, они их поймут). В вашем примере вы открываете его, но не закрываете, и некоторые браузеры могут потерпеть неудачу.
  • Последний элемент абзаца <p> не закрыто Закрывающий тег для абзацев является необязательным (как и многие другие закрывающие теги HTML), но IMO помогает много читабельности. Особенно для новичков, например, <ul> тег закроет абзац, потому что он запрещен внутри <p> но с первого (и второго тоже) взгляда вы можете подумать, что это дочерний узел самого абзаца.

Я думаю, вы просто забыли закрыть <p> а также в идентификаторе span отсутствует цитата

Это должно работать:

<body>
    Dit is mijn eerste website.

        <p> Mijn naam is: <span id="naam"> Stijn Bastiaansen. </span> </p>

        <p> <span id="schuin"> Ik volg deze opleding aan het ICT-Lyceum van het Roc Tilburg. </span> </p>

        <p> <span id="centreren"> Tekst centreren </span> </p>

        <p align="right"> of rechts uitlijnen </p> 

        <p>kan ik ook al.</p>

</body>

Я полагаю, вы не закрыли тег абзаца в последней строке

кан ик оук ал

это должно работать, тэг закрытия абзаца не требуется в HTML в отличие от XHTML, но было бы лучше закрыть все открытые тэги в HTML.

Выход:

Dit is mijn eerste website.
Mijn naam is: Stijn Bastiaansen.

Ik volg deze opleding aan het ICT-Lyceum van het Roc Tilburg.

of rechts uitlijnen

kan ik ook al.
<body>
    Dit is mijn eerste website.
    <p> Mijn naam is: <span id='naam'> Stijn Bastiaansen. </span></p>
    <p>
        <span id='schuin'> Ik volg deze opleding aan het ICT-Lyceum van het Roc Tilburg.</span> 
    </p>
    <p>
        <span id='centreren'> Tekst centreren </span> 
    </p>        
    <p align='right'> of rechts uitlijnen </p> 
    <p>kan ik ook al.</p>
</body>

вот результат. http://jsfiddle.net/BCxNb/

Проблема в вашем последнем предложении основного текста. Вы должны закрыть тег абзаца, чтобы он был распознан и представлен на вашем сайте.

Другие вопросы по тегам