登錄表單是網站或應用程序中常見的一個組件,它通常包括用戶名、密碼等輸入框以及提交登錄信息的按鈕。表單的樣式對于用戶的體驗和頁面風格非常重要。下面將介紹一些關于登錄表單的css樣式。
/* 設置表單元素的默認大小和邊框 */ input[type=text], input[type=password] { width: 100%; padding: 12px 20px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; } /* 設置登錄按鈕的樣式 */ button[type=submit] { background-color: #4CAF50; color: white; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer; } /* 當鼠標懸停在登錄按鈕上時,改變背景色 */ button[type=submit]:hover { background-color: #45a049; } /* 設置表單容器的樣式 */ .form-container { display: flex; flex-direction: column; align-items: center; background-color: #f2f2f2; padding: 20px; border-radius: 5px; } /* 設置表單標題的樣式 */ .form-title { font-size: 24px; margin-bottom: 20px; }
用以上代碼來設置登錄表單的css樣式,可以實現清晰美觀的表單界面,增強用戶體驗。
上一篇百度css錯誤
下一篇css調整圖片和文字間距