html坐标运用

当然可以呀，这种布局方式叫做绝对定位

box_absolute是图中的框2

#box_absolute {

  position: absolute

  left: 30px

  top: 20px

}

绝对定位的元素的位置相对于最近的已定位祖先元素，如果元素没有已定位的祖先元素，那么它的位置相对于最初的包含块。

这里的偏移量，即所谓的坐标x（left）和y（top），css中本身是没有x和y这2个属性的

坐标的单位都是像素，然后看你的元素时绝对定位还是相对定位。position：relative；是相对定位，absolute是绝对定位，那么问题就来了，你要根据div定位，那么就给这个div加上相对定位，然后给里面需要定位的元素加上绝对定位，这样就可以很明确的定位了，比如你已经给这个div加了相对定位，你要给里面一个gif定位在距离左（定位起始点就是左上角，可以视为（0px，0px））边100px；距离上面200px；你就给这个元素写上left：100px； top：200px；就是这个意思，自己去试试吧

很简单啊，你给黑色的div设定相对位置，里面嵌套的红色div设定绝对位置即可

<div style=" width:200pxheight:200pxposition:relativeleft:100pxtop:100pxbackground-color:black">

<div style="position:absoluteright:10pxtop:50%height:50pxwidth:50pxmargin-top:-25pxbackground:red"></div>

</div>

---