CSS(層疊樣式表)是一種用于網頁設計的語言,它可以讓我們實現各種樣式和效果。在設計一個登陸頁面時,CSS的作用不可忽視。下面介紹一些CSS的基本使用方法。
/* 設置頁面背景色和字體樣式 */ body { background-color: #F4F4F4; font-family: Arial, sans-serif; } /* 設置表單樣式 */ form { width: 400px; margin: 50px auto; padding: 20px; background-color: #FFFFFF; border-radius: 10px; box-shadow: 0 0 5px #999999; } /* 設置標題樣式 */ h2 { text-align: center; font-weight: bold; color: #333333; } /* 設置輸入框樣式 */ input[type=text], input[type=password] { width: 100%; padding: 12px 20px; margin: 8px 0; border: 2px solid #CCCCCC; border-radius: 4px; } /* 設置登陸按鈕樣式 */ button[type=submit] { background-color: #4CAF50; color: #FFFFFF; padding: 12px 20px; border: none; border-radius: 4px; cursor: pointer; } /* 設置鏈接樣式 */ a { color: #4CAF50; } /* 設置錯誤提示樣式 */ .error { color: #FF0000; font-weight: bold; }
對于一個簡單的登陸頁面,以上的CSS樣式已經足夠了。使用上述樣式,我們可以得到一個簡潔、美觀的登陸頁面。
上一篇css設計多級菜單
下一篇css設置問題文本樣式