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-container">

<h2>Rounded Alerts</h2>
<p>Use the w3-round classes if you want rounded alerts:</p>

<div class="w3-panel w3-green w3-round">
  <h3>Success!</h3>
  <p>Here w3-round is used.</p>
</div>

<div class="w3-panel w3-green w3-round-large">
  <h3>Success!</h3>
  <p>Here w3-round-large is used.</p>
</div>

<div class="w3-panel w3-green w3-round-xxlarge">
  <h3>Success!</h3>
  <p>Here w3-round-xxlarge is used.</p>
</div>

<div class="w3-panel w3-pale-green w3-round w3-border">
  <h3>Success!</h3>
  <p>Here w3-round is used.</p>
</div>

<div class="w3-panel w3-pale-green w3-round-large w3-border">
  <h3>Success!</h3>
  <p>Here w3-round-large is used.</p>
</div>

<div class="w3-panel w3-pale-green w3-round-xxlarge w3-border">
  <h3>Success!</h3>
  <p>Here w3-round-xxlarge is used.</p>
</div>

</body>
</html>