怎么使用CSS让图片水平垂直都居中?

CSS是层叠样式表。下面,我们来看看怎么使用CSS让图片水平垂直都居中吧。

操作方式

  • 01

    新建一张文档
    在桌面新建一张文本文档,更名为1.txt,如下图所示:

  • 02

    根本代码
    然后打开文本文档,编写根本代码,再把桌面上的山君图片引入进去,如下图所示:

  • 03

    后缀名
    然后把文本文档后缀名改为.html,如下图所示:

  • 04

    运行网页
    然后在浏览器中运行网页,此刻图片有了,只是还没有居中,图片栖身代码要用CSS写,如下图所示:

  • 05

    CSS代码
    然后写上CSS代码,如下图所示:

  • 06

    垂直程度居中
    可以看到图片已经垂直和程度居中,如下图所示:

  • 07

    总代码
    <!DOCTYPE html>

    <head>

    <title>html</title>
    <style type="text/css">
    .picTiger{
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    }

    </style>
    </head>

    <body>

    <img class="picTiger" src="C:/Users/Administrator/Desktop/1.png">

    </body>

    <html>

  • End
  • 发表于 2018-12-09 00:00
  • 阅读 ( 781 )
  • 分类:电脑网络

你可能感兴趣的文章

相关问题

0 条评论

请先 登录 后评论
联系我们:uytrv@hotmail.com 问答工具