會員登錄界面是很常見的網站設計之一,它可以讓網站的注冊用戶直接進入自己的賬戶。下面是一個示例代碼,包含了關于登錄界面中css樣式的說明。
/*登錄表單樣式*/ .login-form { width: 300px; margin: 0 auto; } /*表單輸入框樣式*/ .login-form input[type="text"], .login-form input[type="password"] { width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; border: 2px solid #ccc; border-radius: 4px; } /*登錄按鈕樣式*/ .login-form button { background-color: #4CAF50; color: white; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer; width: 100%; } /*鼠標覆蓋效果*/ .login-form button:hover { background-color: #45a049; } /*全局樣式*/ body { background-color: #f2f2f2; font-family: Arial, Helvetica, sans-serif; color: #333; text-align: center; }
以上代碼中,我們為登錄表單設置了一個寬度,并使其水平居中顯示。此外,我們還為表單中的輸入框設置了樣式:包括輸入框的寬度、內邊距、外邊距、邊框寬度和邊框半徑等。對于登錄按鈕,我們使用了背景顏色、文本顏色、內邊距、外邊距等參數來設置其樣式。我們還使用了:hover選擇器來實現鼠標覆蓋效果。
最后,我們還設定了全局樣式,包括背景顏色、字體、字體顏色和文本居中等屬性。
上一篇mysql 虛擬 字段
下一篇使用css做一個輪播圖