亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

高度和填充 CSS 屬性不適用于搜索輸入元素

高度和填充 CSS 屬性不適用于搜索輸入元素

桃花長相依 2023-09-25 17:13:18
我在 WordPress 網站上有一個簡單的搜索表單,由于某種原因,搜索輸入元素上的height和paddingCSS 屬性不起作用。我不知道為什么?代碼如下,或者您可以在 CodePen 上查看:https://codepen.io/emilychews/pen/NWqBEXq非常感謝任何幫助。這讓我有點瘋狂。SCREENSHOT - 搜索元素的高度應為 2rem,內邊距為 2rem。body {  width: 100%;  height: 100vh;  margin: 0;  padding: 0;  display: flex;  align-items: center;  justify-content: center;}#s{  width: 20rem;   height: 2rem; /* not working */  padding: 2rem; /* not working */}<div id="form-wrap">  <form id="site-search-form">    <div id="site-search-input-wrap">      <input id="s" name="s" type="search" placeholder="Enter your search">      <input class="site-search-submit" type="submit" value="SEARCH">    </div>  </form></div>
查看完整描述

2 回答

?
哆啦的時光機

TA貢獻1779條經驗 獲得超6個贊

瀏覽器并不會真正讓你搞亂input type="search"CSS-Tricks 有一個非常好的概述。

如果樣式很重要,我要么找到一個組件,要么使用 Javascript 更改input type="text"并復制其他所需的搜索功能(例如建議列表或歷史記錄)。

簡單的文本搜索很可能可以像文本輸入一樣工作。


查看完整回答
反對 回復 2023-09-25
?
藍山帝景

TA貢獻1843條經驗 獲得超7個贊

我找到了解決方案 - 您需要bordersearch輸入元素添加 CSS 屬性,否則默認邊框將保留,從而限制元素的視覺高度。例如添加border: 1px solid可以解決問題。



查看完整回答
反對 回復 2023-09-25
  • 2 回答
  • 0 關注
  • 119 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號