From this answer //allinonescript.com/a/9795126/292060, it looks like Chrome is either matching a regex pattern on the field name, or the form is explicitly using the
x-autocompletetype attribute, like this (This example uses "somename" to avoid mixing issues matching on the name):
<input type="text" name="somename" x-autocompletetype="cc-number" />
Practically, you could do both, picking a name that matches, and the x-autocompletetype:
<input type="text" name="ccnum" x-autocompletetype="cc-number" />
Do you have a view-source of the input box in your screenshot? That would show if it's matching on the name or on the x-autocompletetype attribute.
The answer I linked to has several links for more information; I didn't repeat them here.
Some other comments:
I know Chrome pops a question whether to save the credit card information (I don't), but I don't know if it is popping that question regardless of how it detected it. That is, I'm not sure if Chrome will autocomplete separate fields of credit cards along with other fields, or if it needs to save the whole thing as a credit card.
Your question was how to do it, not whether to. But from the comment in your question, I agree that you might not want to autocomplete the credit card fields. Personally I find it disconcerting when it happens, even knowing it's local in my browser (I especially feel this way about the CVV, and get a surprising amount of resistance when I report it). However, there are posts that find it frustrating when a customer wants to use it, has Chrome set up with credit cards, and a website blocks it.