HTML经典绝对定位图片

HTML绝对定位：

经典定位代码：

	下面展示一些 `CSS代码片`。

//inner为外部盒子
inner1为内部盒子

        .inner {
            width: 500px;
            height: 500px; /*作为外包盒子要有一定的大小，就是首先你得是个合格的盒子*/
            position: relative; /*相对定位 说明把当前标签作为参照物这玩意必须写 不写不行*/
            margin: 10px auto; /*与顶部相隔10px,左右居中*/
            border: 1px solid red;
           text-align: center; /*块级元素文字等居中*/
        }
       .inner1 {
            height: 100px;
            width: 70px;
            left: 50%; /*左右无所谓主要是50%必须是一半！*/
            top: 50%; /*上下无所谓主要是50%必须是一半！*/
            margin-left: -35px; /*盒子本身大小为height:100px;width:70px;减去一半保证绝对居中 */
            margin-top: -50px;
            position: absolute; /*绝对定位*/
        }

HTML内部写法：
<div class="inner">
    <div class="inner1">
        <img src="./image.jpg" alt="">
        <p>也可加上文字</p>
    </div>
</div>

效果展示