CSS是網頁設計中非常重要的一部分,通過CSS我們可以美化網頁,讓網頁更加美觀和易于操作。
設置form的樣式也是CSS中常見的一項任務,一般需要修改form的背景、邊框、內邊距、外邊距等屬性。
form{ background-color: #EFEFEF; border: 1px solid #999; padding: 10px; margin: 20px 0; }
上述代碼中,我們設置了form的背景顏色為#EFEFEF,邊框為1px固定,顏色為#999,內邊距為10px,外邊距為20px。
除此之外,我們還可以為form中的輸入框、輸入文本、按鈕等元素設置樣式:
input[type="text"], input[type="password"]{ border: 1px solid #999; padding: 5px; width: 200px; margin-bottom: 10px; } button{ background-color: #333; color: #fff; border: none; padding: 10px; cursor: pointer; }
上述代碼中,我們設置了input[type="text"]和input[type="password"]的邊框為1px固定,顏色為#999,內邊距為5px,寬度為200px,下方的margin為10px。我們還為按鈕設置了背景顏色為#333,文字顏色為#fff,邊框為none,內邊距為10px,鼠標移至按鈕上時改變光標形狀。
通過以上樣式設置,我們可以自由地美化網頁中的form元素,為用戶提供更加優秀的操作體驗。
下一篇css預編譯優勢