js中表单divcss样式美化

可以通过以下步骤对表单进行样式美化：

1. 给表单外层的div添加样式，比如设置宽度、边框、背景色等。
2. 修改表单元素的默认样式，比如设置边框、边框圆角、背景色、字体颜色等。
3. 设置表单元素的鼠标悬停样式和选中样式。

示例代码如下：

HTML代码：

<div class="form">
  <form>
    <label>用户名：</label>
    <input type="text">
    <label>密码：</label>
    <input type="password">
    <button type="submit">提交</button>
  </form>
</div>

CSS代码：

.form {
  width: 400px;
  border: 1px solid #ccc;
  background-color: #f7f7f7;
  padding: 20px;
}

label {
  display: block;
  margin-bottom: 10px;
}

input[type="text"],
input[type="password"],
button {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px 10px;
  background-color: #fff;
  color: #333;
  font-size: 14px;
}

input[type="text"]:hover,
input[type="password"]:hover,
button:hover {
  border-color: #999;
}

input[type="text"]:focus,
input[type="password"]:focus,
button:focus {
  border-color: #333;
  box-shadow: 0 0 2px #333;
}

这样就可以对表单进行简单的样式美化了。