-3
このサイトにサイトを持っています私はサッカーのヒントのための反応テーブルを持っています。 私はすでにデータベースに接続して日付を取得することができます。それはデスクトップ上に表示されます。デスクトップ上で動作しますが、モバイルでは何も表示されません。 私はhtmlとcssコードを書き留めました。私は初心者ですので、私を助けてください。mysqlからデータを取得できませんモバイル専用デスクトップ
table {
border-spacing: 1;
border-collapse: collapse;
background: #FFED86;
border-radius: 6px;
overflow: hidden;
max-width: 800px;
width: 100%;
margin: 0 auto;
position: relative;
}
table * {
position: relative;
}
table td, table th {
padding-left: 8px;
}
table thead tr {
height: 60px;
background: #FFED86;
font-size: 16px;
}
table tbody tr {
height: 48px;
border-bottom: 1px solid #000000;
}
table tbody tr:last-child {
border: 0;
}
table td, table th {
text-align: left;
}
table td.l, table th.l {
text-align: right;
}
table td.c, table th.c {
text-align: center;
}
table td.r, table th.r {
text-align: center;
}
@media screen and (max-width: 35.5em) {
table {
display: block;
}
table > *, table tr, table td, table th {
display: block;
}
table thead {
display: none;
}
table tbody tr {
height: auto;
padding: 8px 0;
}
table tbody tr td {
padding-left: 45%;
margin-bottom: 12px;
}
table tbody tr td:last-child {
margin-bottom: 0;
}
table tbody tr td:before {
position: absolute;
font-weight: 700;
width: 40%;
left: 10px;
top: 0;
}
table tbody tr td:nth-child(1):before {
content: "HOME";
}
table tbody tr td:nth-child(2):before {
content: "AWAY";
}
table tbody tr td:nth-child(3):before {
content: "TIP";
}
table tbody tr td:nth-child(4):before {
content: "ODD";
}
table tbody tr td:nth-child(5):before {
content: "DATE";
}
table tbody tr td:nth-child(6):before {
content: "TIME";
}
}
body {
background: #50040d;
font: 400 14px 'Calibri','Arial';
padding: 20px;
}
blockquote {
color: #ffed86;
text-align: center;<?php
//including the database connection file
include_once("config.php");
//fetching data in descending order (lastest entry first)
$result = $dbConn->query("SELECT * FROM users ORDER BY id DESC");
?>
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Best Soccer Tips</title>
<link rel="stylesheet" href="css/style.css">
</head>
<blockquote> <strong>Best Soccer Tips</strong> </blockquote>
<body>
<table>
<thead>
<tr>
<th>HOME</th>
<th>AWAY</th>
<th>TIP</th>
<th>ODD</th>
<th>DATE</th>
<th>TIME</th>
</tr>
<?php
while($row = $result->fetch(PDO::FETCH_ASSOC)) {
echo "<tr>";
echo "<td>".$row['home']."</td>";
echo "<td>".$row['away']."</td>";
echo "<td>".$row['tip']."</td>";
echo "<td>".$row['odd']."</td>";
echo "<td>".$row['date']."</td>";
echo "<td>".$row['time']."</td>";
}
?>
<link rel="stylesheet" href="css/style.css">
<table/>
<blockquote> <strong>Best Soccer Tips</strong> </blockquote>
<blockquote> <strong>Good Luck</strong> </blockquote>
</body>
@media画面（最大幅：35.5em）は '使用してみてください：{{'適切なメディアが –
@media画面と（35.5em最大幅）を問い合わせます テーブル{ display：block; – Murat
既にそこにあるがeffect.ifはない私は600の下で私のテーブルを表示していない600 pxのようなブラウザを小さくするdektopビューでモバイル上で同じことが表示されますそれはshows.butモバイルだけblockquotesテーブルではない – Murat