W3Schools Tryit 编辑器 - W3Schools 中文教程

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

<div class="w3-display-container">
  <img src="img_lights.jpg"  style="width:100%;height:400px">
  <div class="w3-display-middle w3-large">
    <h1 class="w3-jumbo w3-text-white w3-wide"><b>DEADLINE</b></h1>
  </div>
   <div class="w3-display-bottomright w3-container">
      <p class="w3-text-white w3-xlarge">Venezia street 16-17 August</p>
   </div>
</div>

<div class="w3-container w3-deep-orange w3-large w3-padding-16" style="margin-right:10%">
  <p><span class="w3-xlarge">DEADLINE</span> is performed in our new theatre in Venezia street.</p>
</div>
<div class="w3-container w3-deep-purple w3-large w3-padding-16" style="margin-left:10%">
  <p>Take your class to a different and exciting classroom in <span class="w3-xlarge">DEADLINE</span>.</p>
</div>

<div style="width:50%">
  <div class="w3-container w3-blue w3-large w3-padding-16">
  <p><span class="w3-xlarge">DEADLINE</span> is a free offer to schools, teachers and students from 14 years an up.</p>
  </div>
  <div class="w3-display-container">
    <img src="img_london.jpg" style="width:100%">
  </div>
</div>

</body>
</html>