<!DOCTYPE html>
<html>
<head>
<title>W3.CSS(w3cschool.cn)</title>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="UTF-8">
<link rel="stylesheet" href="https://7npmedia.w3cschool.cn/w3.css">
</head>
<body>
<div class="w3-container">
<h2>折叠栏宽度</h2>
<p>使用CSS width属性更改折叠栏的宽度:</p>
<div class="w3-grey w3-section" style="width:25%">
<button onclick="myFunction('Demo1')" class="w3-button w3-block">
25%</button>
<div id="Demo1" class="w3-hide w3-container">
<p>Lorem自身25%宽度</p>
</div>
</div>
<div class="w3-dark-grey w3-section" style="width:50%">
<button onclick="myFunction('Demo2')" class="w3-button w3-block">
50%</button>
<div id="Demo2" class="w3-hide w3-container">
<p>Lorem自身50%宽度</p>
</div>
</div>
<div class="w3-light-grey w3-section" style="width:75%">
<button onclick="myFunction('Demo3')" class="w3-button w3-block">
75%</button>
<div id="Demo3" class="w3-hide w3-container">
<p>Lorem自身75%宽度</p>