按钮

本课属于 Coddy HTML 学习旅程的“使用 CSS 添加样式”单元。第 53 课，共 76 课。

挑战

简单

在本课中，我们将为提交按钮添加样式，让它更美观。你将设置背景颜色、调整文字颜色和内边距、圆化边角，并为表单添加阴影，让它更加醒目。

为 <button> 元素添加样式。按照以下步骤操作：

将 width 设为 100%，让按钮填满整个空间。
将 background-color 设为你喜欢的颜色。
更改文字颜色 ，让字体更加醒目。
添加内边距，让间距更合适。
将边角设为圆角。
为按钮设置 box-shadow 属性，让它从背景中凸显出来。

亲手试试

<html>
<head>
    <title>Login Form</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <form class="login-form">
        <h2>Login</h2>
        <input type="text" placeholder="Username">
        <input type="password" placeholder="Password">
        <button type="submit">Login</button>
    </form>
</body>
</html>