[Html]
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> untitled document </title>
<Style type = "text/css">
. First {
Border: solid 1px # F00;
/* Border: none; // set the first border to none to check its effect */
/*** Black borders exist on the outer side of the red border to form a dual border ***/
}
. Second {
Border: solid 1px # F00;
/*** Black borders exist on the outer side of the red border to form a dual border ***/
}
</Style>
</Head>
<Body>
<Input type = "submit" value = "aaa" class = "first"/>
<Input type = "submit" value = "aaa" class = "second"/>
</Body>
</Html>
Found:
1. If only one submit exists, the border of the submit must be a double border;
2. If more than one submit exists, the border of the first submit is a double-layer border by default. When you click another submit, the double border is transferred to the clicked submit;
3. If more than one submit exists, the first submit will be set to a double border by default when all submit loses focus;
4. If more than one submit exists, after the border of the first submit is set to none, the other submit still has a double border after obtaining the focus, after the focus is lost, there will be no more double borders, because the border of the first submit has been set to none;
Solution:
1. The first submit uses the background image and sets the border to none. Other submit values are subject to the actual situation;
Author: qinglinglaoren