WAP 表單 CSS是為適配手機小屏幕而設計的一種 CSS 樣式表,可以美化手機瀏覽器中的表單元素。如今,隨著越來越多的人使用手機進行網頁瀏覽,WAP 表單 CSS 的重要性也日益增強。
WAP 表單 CSS 中常見的元素包括:輸入框、下拉框、單選框、復選框、提交按鈕等。針對不同的元素,可以設置不同的樣式。以下是一個簡單的 WAP 表單 CSS 示例:
/* 輸入框樣式 */ input[type=text], input[type=password] { width: 70%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; outline: none; font-size: 16px; } /* 下拉框樣式 */ select { width: 70%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; outline: none; font-size: 16px; background-color: #fff; -webkit-appearance: none; /* 去掉下拉框默認樣式 */ } /* 單選框和復選框樣式 */ input[type=radio], input[type=checkbox] { margin-right: 5px; vertical-align: middle; } /* 提交按鈕樣式 */ input[type=submit] { display: block; width: 50%; padding: 10px; margin: 20px auto; border-radius: 5px; background-color: #4CAF50; color: #fff; font-size: 16px; border: none; outline: none; cursor: pointer; } /* 按鈕 hover 樣式 */ input[type=submit]:hover { background-color: #3e8e41; }
在實際使用中,可以根據具體需求自定義 WAP 表單 CSS 樣式。但需要注意的是,WAP 表單 CSS 樣式的設計應該符合手機小屏幕的特點,不能過于復雜并且要盡量避免影響用戶體驗。
下一篇web 字體css