在網站或應用中，鑒別銀行卡號的有效性至關重要。CSS可以幫助我們為輸入框添加實時驗證，確保用戶輸入正確的銀行卡號。

在CSS中，我們可以通過偽類選擇器`:valid`和`:invalid`對用戶輸入的內容進行樣式上的區分。當輸入符合預設條件時，`:valid`類會被添加到輸入框中；當輸入不符合條件時，則添加`:invalid`類。

input[type="text"]:valid {
border: 2px solid green;
}
input[type="text"]:invalid {
border: 2px solid red;
}

現在，我們需要在銀行卡輸入框中添加一個正則表達式限制規則，確保用戶輸入的字符都是數字。

input[type="text"]:valid {
border: 2px solid green;
}
input[type="text"]:invalid {
border: 2px solid red;
}
input[type="text"]:invalid {
background-color: #FFC0C0;
}
input[type="text"]:focus:invalid {
background-color: #FFE8E8;
}
input[type="text"][pattern="\d+"] {
outline: none;
}

這個正則表達式`\d+`，可以將銀行卡輸入框?以數字組成的任何排列方式都視作合法。當用戶輸入了非數字字符時，輸入框將會變成紅色，意味著輸入不符合預期。

CSS驗證可以使銀行卡輸入更為方便，讓用戶更快速地輸入準確的銀行卡號。