CSS 图像居中对齐
CSS 图像居中对齐
我们在《CSS 内外边距》学过内容居中,它的原理是将外边左右设置为auto。图像居中也是这个原理。
示例
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>图像居中</
title
>
<
meta
charset
=
"UTF-8"
>
<
style
type
=
"text/css"
>
img.align-center { /*图像居中对齐*/
display: block; /*图像块显示*/
margin: 0px auto;}
img.medium { /*图像中等大小显示*/
width: 250px;
height: 250px;}
</
style
>
</
head
>
<
body
>
<
h1
>软件开发,成就梦想</
h1
>
<
p
><
img
src
=
"https://www.0735it.net/images/kc/jspservlet.jpg"
alt
=
"Servlet/JSP课程"
class
=
"align-center medium"
/>
<
b
><
i
>Servlet</
i
></
b
> 用Java编写的服务器端程序,可以交互式地浏览和修改数据,生成动态Web内容。是Java企业级应用技术第一站。</
p
>
</
body
>
</
html
>