1、要想让图片显示在右上角，只需要使用float属性即可达到目的。打开Hbuilder编辑器，在html空白文档里输入基本的结构，这里设置一个外围的div盒子，给一个class命名为container，给外围的div加入css属性，设置好高度宽度和背景颜色：
2、接着在div里引入示例图片，这里给图片的div设置为右浮动，设置图片的宽度和高度，并让图片中心显示，然后按下Crtl+S保存一下：
3、最后需要打开浏览器，就可以看见图片的位置在金色div的右上角了。以上就是在html里将图片放在右上角的流程：
把这个DIV放到你想放到的地方，然后修改一下样式就可以了<style>
.time{...........................}
</style>
<div class="time">
<SCRIPT language=JavaScript>
<!--
tmpDate = new Date()
date = tmpDate.getDate()
month= tmpDate.getMonth() + 1
year= tmpDate.getYear()
document.write(year)
document.write("年")
document.write(month)
document.write("月")
document.write(date)
document.write("日 ")
myArray=new Array(6)
myArray[0]="星期日"
myArray[1]="星期一"
myArray[2]="星期二"
myArray[3]="星期三"
myArray[4]="星期四"
myArray[5]="星期五"
myArray[6]="星期六"
weekday=tmpDate.getDay()
if (weekday==0 | weekday==6)
{
document.write(myArray[weekday])
}
else
{
document.write(myArray[weekday])
}
// -->
</SCRIPT>
</div>
一个分享按钮，一个隐藏的图片（这个图片绝对定位在右上角）然后就是点击显示，点击隐藏了。<a href="javascript:" onclick="document.getElementById('mcover').style.display='block'">分享到朋友圈</a>
<div id="mcover" onclick="document.getElementById('mcover').style.display=''" style="display: none">
<img src="/public/images/guide.png">
</div>
对应样式如下：
#mcover {
position: fixed
top: 0
left: 0
width: 100%
height: 100%
background: rgba(0, 0, 0, 0.7)
display: none
z-index: 20000
}
#mcover img {
position: fixed
right: 18px
top: 5px
width: 260px
height: 180px
z-index: 999
}
