# google form 自動填入 CSS

常常遇到google Chrome 表單自動填入
但defalt樣式很不美觀 或與整體視覺搭不起來的狀況

爬文後找到兩種解法

## autofill

`box-shadow`和`text-fill-color`一定要加`-webkit-`去騙Chrome

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 50px #fff inset; 
    /* 用inset內陰影去填滿整個input = 背景色 第4個參數可以調999px */
  -webkit-text-fill-color: #223148; 
    /* 字的顏色 */
  border: 1px solid #EAF4E6;
}

## autocomplete

直接關閉自動填入的方法
但該方法還沒成功

整個form都關掉
<form autocomplete="off">

指定input關閉
<input autocomplete="off">

*參考(1): https://stackoverflow.com/questions/2338102/override-browser-form-filling-and-input-highlighting-with-html-css
參考(2): https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/*