0

テーブルを使用せずに mysql で行を表示するにはどうすればよいですか? ツイッターフィードやフェイスブックと同じように。<span>または<div>順序なしリストを使用することは可能ですか?

写真のサムネイル、名前、投稿を表示したい。

現在の私のコードでは、投稿自体のみが表示されます。

$sql_check = mysql_query("SELECT * FROM messages order by msg_id desc");
if(isset($_POST['message']))
{
    $message = $_POST['message'];

    mysql_query("INSERT INTO messages(msg, userid) values ('$message', ". $s_id . ")");

    $sql_msg = mysql_query("SELECT msg ,msg_id FROM messages where userid = $s_id order by msg_id desc");

    $row = mysql_fetch_array($sql_msg);
}

while($row = mysql_fetch_array($sql_msg)){
    <table cellpadding="0" cellspacing="0" width="500px">
        <tr>
            <td style="padding:14px;" class="comment_box" align="left"><?php echo $row['msg']; </td>
        </tr>
    </table>
}
4

2 に答える 2

0

テーブルの代わりに、divまたはspan...を使用します

$sql_check = mysql_query("SELECT * FROM messages order by msg_id desc");
if(isset($_POST['message']))
{
$message = $_POST['message'];

mysql_query("INSERT INTO messages(msg, userid) values ('$message', ". $s_id . ")");

$sql_msg = mysql_query("SELECT msg ,msg_id FROM messages where userid = $s_id order by msg_id desc");

$row = mysql_fetch_array($sql_msg);
}

while($row = mysql_fetch_array($sql_msg)){ ?>

        <div><?php echo $row['msg']; ?> </div>
<?php
}
于 2013-02-07T14:06:19.057 に答える
0

問題のコンテンツに最も適したものに基づいて、マークアップを選択してください。表形式のデータがある場合、それはテーブルに属します。リストはリストに入れるべきです。「tagX が悪い」という考えに基づいて選択しないでください。また、外観が変更される可能性があるため、特定の方法に見えるという理由で選択しないでください。最終的には、どんなものでも同じように見える可能性があるため、適切なファンデーションを選択してください。

表は、この種のコンテンツのマークアップとして最初に選択するものではありませんが、許容できるものです。

http://jsfiddle.net/dcWsp/

table, tbody {
    display: block;
}

tr {
    display: block;
    overflow: hidden;
    margin: 1em 0;
}

td {
    display: block;
}

td.avatar {
    float: left;
    margin-right: 1em;
}

td.author {
    font-weight: bold;
}

<table>
    <!-- loop starts here -->
    <tr>
        <td class="avatar"><img src="http://placehold.it/100x100" /></td>
        <td class="author">Batman</td>
        <td class="message">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus porta elit vel ante hendrerit facilisis. Curabitur aliquam sollicitudin diam, id posuere elit consectetur nec. Vestibulum quam dolor, feugiat in posuere a, posuere imperdiet tellus. Mauris sed ligula vitae urna consequat aliquet.</td>
    </tr>
    <!-- loop ends here -->
</table>

マークアップしてスタイリングする別の方法を次に示します。これは実質的に同じに見えます。

http://jsfiddle.net/dcWsp/2/

article {
    overflow: hidden;
    margin: 1em 0;
}

img.avatar {
    float: left;
    margin: 0 1em 1em 0;
}

h1.author {
    font-weight: bold;
}

<section class="comments">
    <!-- loop starts here -->
    <article>
        <h1 class="author"><img src="http://placehold.it/100x100" class="avatar" /> Batman</h1>
        <p class="message">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus porta elit vel ante hendrerit facilisis. Curabitur aliquam sollicitudin diam, id posuere elit consectetur nec. Vestibulum quam dolor, feugiat in posuere a, posuere imperdiet tellus. Mauris sed ligula vitae urna consequat aliquet.</p>
    </article>
    <!-- loop ends here -->
</section>
于 2013-02-07T15:57:38.813 に答える