<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0;
}
* {
box-sizing: border-box;
}
input, textarea {
width: 100%;
}
</style>
</head>
<body>
<form action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br>
Comments:<br>
<textarea name="message" rows="5" cols="30">
</textarea>
<br><br>
<input type="submit" value="提交">
</form>
<p><strong>提示:</strong>尝试从样式元素中删除 box-sizing 属性,看看会发生什么。
请注意,输入、文本区域和提交按钮的宽度将超出屏幕。</p>
</body>
</html>