Display the image in the center of the div in jsp, as shown in figure
Example:
Copy codeThe Code is as follows:
// CSS File
<Style type = "text/css">
# Bj {
Width: 200px;
Height: 200px;
Border: 3px solid red;
Text-align: center;
Vertical-align: middle;
Display: table-cell; // displays an object as a table cell.
Background: pink;
}
Img {
Width: 150px;
Height: 150px;
Margin: 0 auto;
Vertical-align: middle;
Border: 2px solid green;
}
</Style>
</Head>
// Body File
<Body>
<Div id = "bj">
</Div>
</Body>
If the image is in html, the image is centered, but the image is horizontally centered in jsp. In this case, we need to Copy codeThe Code is as follows:
<! Add w3c standard statement to DOCTYPE>, for example:
<! 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">
Adding the image in Jsp will be centered as expected!