HTML Markup Комментарии

голоса
8

Я в настоящее время в процессе создания моего собственного блога, и я должен разметить комментарии, но то, что это лучший способ отметить это?

Информация, которую я должен представить это:

  1. Лица Имя
  2. Gravatar Иконка
  3. Комментарий Дата
  4. Комментарий

Любая идея была бы гораздо appriciated.

PS: Я заинтересован только в семантической HTML разметки.

Задан 07/08/2008 в 20:46
источник пользователем
На других языках...                            


5 ответов

голоса
4

Я думаю, что ваша версия с процитировать, BLOCKQUOTE и т.д., безусловно, работать, но если семантика ваша главная забота, то лично я бы не использовать процитировать и BLOCKQUOTE, поскольку они имеют конкретные вещи, которые они должны представлять.

BLOCKQUOTE Тег предназначен для представления цитаты взяты из другого источника и процитировать тег предназначен для представления источника информации (например, журнала, газеты и т.д.).

Я думаю , что аргумент , безусловно , может быть , что вы можете использовать семантический HTML с именами классов, при условии , что они имеют смысл. Эта статья на Plain Old Semantic HTML делает ссылку на использование имен классов - http://www.fooclass.com/plain_old_semantic_html

Ответил 07/08/2008 в 21:46
источник пользователем

голоса
1

Вот один из способов вы можете сделать это с помощью следующего CSS плавать изображение слева от содержания:

.comment {
  width: 400px;
}

.comment_img {
  float: left;
}

.comment_text,
.comment_meta {
  margin-left: 40px;
}

.comment_meta {
  clear: both;
}
<div class='comment' id='comment_(comment id #)'>
  <div class='comment_img'>
    <img src='https://placehold.it/100' alt='(Commenter Name)' />
  </div>
  <div class='comment_text'>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p>
    <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p>
  </div>
  <p class='comment_meta'>
    By <a href='#'>Name</a> on <span class='comment_date'>2008-08-21 11:32 AM</span>
  </p>
</div>

Ответил 07/08/2008 в 20:56
источник пользователем

голоса
0

Я вижу вашу точку. OK, после прочтения этой статьи, почему бы не попробовать что-то вроде этого?

<blockquote 
    cite="http://yoursite/comments/feederscript.php?id=commentid" 
    title="<?php echo Name . " - " . Date ?>" >
    <?php echo Comment ?>
</blockquote>

с какой-то притягательной CSS, чтобы сделать его хорошо выглядеть.

feederscript.php бы то, что можно прочитать из базы данных и эхо только CommentID призвал.

Ответил 07/08/2008 в 23:07
источник пользователем

голоса
0

Я, возможно, думал о чем-то вроде этого:

<ol class="comments">
    <li>
        <a href="">
            <img src="" alt="" />
        </a>
        <cite>Name<br />Date</cite>
        <blockquote>Comment</blockquote>
    </li>
</ol>

Это очень семантический без использования Div, и только один класс. Список показать заказ были сделаны замечания, ссылка на сайт человека, и образ их Gravatar, то процитировать тег на сайт, который сказал, комментарий и BLOCKQUOTE держать то, что они сказали.

Что люди думают?

Ответил 07/08/2008 в 21:16
источник пользователем

голоса
0

Я не знаю , что есть разметка , которая обязательно представляет собой комментарий структуру хорошо без использования дивы или классов , а также, но вы можете использовать списки определений. Вы можете использовать несколько DT и DD - тег в контексте списка определений - http://www.w3.org/TR/html401/struct/lists.html#edef-DL

<dl>
  <dt>By [Name] at 2008-01-01<dt>
  <dd><img src='...' alt=''/></dd>
  <dd><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p>

  <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p>
   </dd>
</dl>

Обновление: беспокойство, которое я бы с подходом, как это, что это может быть трудно однозначно идентифицировать элементы с CSS для целей моделирования. Вы можете использовать JavaScript (JQuery бы здорово здесь), чтобы найти и применить стили. Без полной поддержки селектора CSS в различных браузерах (IE), было бы труднее стиль.

Ответил 07/08/2008 в 21:08
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more