w3css 在线编辑器 | w3css代码测试

<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.cainiaomax.com/w3css/4/w3.css">
<body>

<div class="w3-twothird">
  <img src="img_chardonnay.jpg" style="width:100%">
  <h2>Food</h2>
  <table class="w3-table w3-striped w3-bordered w3-border">
  <thead class="w3-teal"><th style="width:30%">Food</th><th>Type</th></thead>
  <tr><td style="width:30%">Seafood</td><td>Shrimps, Crab, Lobster</td></tr>
  <tr><td>Meat</td><td>Chicken, Pork</td></tr>
  <tr><td>Cheese</td><td>Brie, Gruyere</td></tr>
  <tr><td>其他</td><td>Cream sauces</td></tr>
  </table>
  <h2>Flavours</h2>
  <table class="w3-table w3-striped w3-bordered w3-border">
  <thead class="w3-teal"><th style="width:30%">Age</th><th>Flavor</th></thead>
  <tr><td>Less Ripe</td><td>Green Plum, Green Apple, Pear </td></tr>
  <tr><td>Medium</td><td>Lemon, Peach, Melon</td></tr>
  <tr><td>More Ripe</td><td>Pineapple, Fig, Banana, Mango</td></tr>
  <tr><td>Oaked</td><td>added Cream or Butter</td></tr>
  </table>
  <h2>Neighbours</h2>
  <table class="w3-table w3-striped w3-bordered w3-border">
  <thead class="w3-teal"><th style="width:30%">Neighbour</th><th>Flavour</th></thead>
  <tr><td>Pinot Gris</td><td>Like under-riped Chardonnay </td></tr>
  <tr><td>Semillion</td><td>Lighter with more lemon</td></tr>
  <tr><td>Viognier</td><td>More Vanilla, Flowers or Perfume</td></tr>
  </table> 
</div>

<div class="w3-third">
  <h1>霞多丽</h1>
  <p>霞多丽是世界上最受欢迎的酿酒葡萄。</p>
  <p>霞多丽葡萄的味道非常中性，很容易让人喜欢。</p>
  <p>许多霞多丽风味源自风土和橡木桶陈酿。</p>
  <p>口味各不相同，从明显的酸度（寒冷气候）到松脆的矿物质（法国夏布利）
  带有青梅、苹果和梨的味道，到重橡木和热带水果的味道（新世界）。 </p>
  <p>在较凉爽的气候中，霞多丽往往未完全成熟。 </p>
  <p>在温暖的气候下，柠檬、桃子和甜瓜的味道往往会有所不同。</p>
  <p>在非常温暖的气候下，霞多丽往往会过度成熟。</p>
  <p>经过橡木桶陈酿的霞多丽往往具有更柔和的酸度和更多的水果风味
  添加了黄油、奶油和榛子味。</p>
 </div>

</div>
</body>
</html>

报个问题: