質問編集履歴

1 タグの修正。

Mtu449

Mtu449 score 13

2019/01/26 18:59  投稿

オートコンプリートの背景色を透明にしたい。
オートコンプリートの背景色を透明にしたいのですが、黄色のまま変わりません。普通に検索する時は透明のままです。![イメージ説明](548b30226f03f5c1479f69eb5cd46eab.png)
```css
.search_container{
box-sizing: border-box;
position: relative;
border: 1px solid #999;
padding: 3px 10px;
border-radius: 20px;
height: 3em;
width: 300px;
overflow: hidden;
}
.search_container input[type="text"]{
border: none;
height: 2.6em;
background: none;
color:white;
}
.search_container input[type="text"]:focus {
outline: 0;
}
.search_container input[type="submit"]{
cursor: pointer;
font-family: FontAwesome;
font-size: 1.7em;
border: none;
background: none;
color: #3879D9;
position: absolute;
width: 1.5em;
height: 2.2em;
right: 0;
top: -10px;
outline : none;
}
```
```html
<form method="get" action="{{ route('posts.search') }}" class="search_container">
<div class="input-group">
<input type="text" size="30" placeholder="キーワード検索" name="search" >
<input type="submit" value="&#xf002" >
</div>
</form>
```
同じような悩みを検索し、
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px transparent inset;
}
または、
input:-webkit-autofill {
background:rgba(255,255,255,0) !important;
}
を記載してみたのですが、うまくいきませんでした。
回答お待ちしております。
  • Bootstrap

    1999 questions

    BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

  • CSS

    12151 questions

    CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

  • HTML

    17617 questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • Laravel 5

    3149 questions

    Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る