Dreamweaver是一款常用的網頁設計軟件,同時也支持CSS樣式的設計。在網頁設計中,表單是必不可少的部分,而CSS可以幫助我們設計出漂亮的表單樣式。
下面是一個簡單的表單樣式設計示例:
form { width: 60%; margin: 0 auto; } input[type="text"], input[type="email"], textarea { width: 100%; padding: 10px; margin-bottom: 15px; border: none; border-radius: 3px; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); } label { display: block; margin-bottom: 5px; } input[type="submit"] { background-color: #007FFF; color: #fff; padding: 10px 20px; border: none; border-radius: 3px; cursor: pointer; } input[type="submit"]:hover { background-color: #0060bf; }
以上CSS代碼實現了以下功能:
1. 讓表單與瀏覽器居中對齊,寬度占60%;
2. 定義輸入框(包括文本框和文本域)的樣式,包括背景、邊框、圓角、陰影等;
3. 定義標簽的樣式,包括外邊距和下邊距;
4. 定義提交按鈕的樣式,包括背景、邊框、圓角、文字顏色和鼠標懸浮效果。
在實際項目中,我們可以根據需求調整這些樣式。例如,可以添加更多的輸入框類型,例如密碼框和選擇框,還可以添加更多的CSS屬性來自定義樣式。
以上是使用Dreamweaver設計表單樣式的簡單介紹,希望能夠幫助您更好地設計網頁表單。
上一篇dw網頁設計作業css
下一篇css里面文字怎么加粗