CSS是一種用來定義網頁外觀的樣式語言,通過CSS可以實現網頁中各種元素的布局、顏色、字體等樣式的控制。接下來我們來學習如何使用CSS構建一個賬號表單。
/* 賬號表單樣式 */ .account-form { width: 400px; margin: 30px auto; padding: 20px; background-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,.2); border-radius: 5px; } .account-form h2 { font-size: 24px; text-align: center; margin-bottom: 10px; } .account-form p { margin-bottom: 10px; font-size: 14px; } .account-form input[type="text"], .account-form input[type="password"] { width: 100%; height: 40px; padding: 10px; margin-bottom: 20px; border: none; background-color: #f1f1f1; border-radius: 5px; } .account-form input[type="submit"] { display: block; width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #6c5ce7; color: #fff; border: none; border-radius: 5px; cursor: pointer; } .account-form input[type="submit"]:hover { background-color: #4834d4; }
以上是一個簡單的賬號表單樣式,可以根據需要自定義修改其中的樣式屬性,讓表單更加適合自己的網站。希望大家通過學習本文,可以更好地掌握CSS的應用。
上一篇mysql 輸出日志
下一篇css頁碼豎排顯示