zoukankan      html  css  js  c++  java
  • 微信小程序

    标题图

    微信小程序 - 相对定位和绝对定位

    相对定位relative,绝对定位absolute

    相对定位:元素是相对自身进行定位,参照物是自己.

    绝对定位:元素是相对离它最近的一个父级元素进行定位.

    相对定位:relative

    position:relative;    /*相对定位*/
    left:50rpx;    /*相对于自己往右偏离50*/
    top:50rpx;     /*相对于自己往下偏离50*/
    

    绝对定位:absolute

    position: absolute;
    left: 50rpx;
    top: 50rpx;
    

    效果:

    效果

    .bei {
       100rpx;
      height: 100rpx;
      flex: 1;
      border-radius: 50%;
      background-color: #00b2ee;
      margin: 30rpx auto 0;
    }
    
    .bei image {
       90rpx;
      height: 90rpx;
      margin-top: 5rpx;
    }
    
    .text {
      font-size: 30rpx;
      color: #fff;
      position: relative;
      top: 20rpx;
    }
    

    .wxml

    <view class='bei'>
              <image src='/images/Attendance-early.png' style="display: {{none}};"></image>
              <text class='text'>{{zao}}</text>
    </view>
    

    position【定位属性:static,relative,absolute,fixed,inherit,-ms-page,initial,unset】

    相对路径和绝对路径

    绝对路径: 以“/”开头代表根目录

    相对路径:

    ../../a/index
    或者:
    a/index
    

    达叔小生:往后余生,唯独有你
    You and me, we are family !
    90后帅气小伙,良好的开发习惯;独立思考的能力;主动并且善于沟通
    简书博客: 达叔小生
    https://www.jianshu.com/u/c785ece603d1

    结语

    • 下面我将继续对 其他知识 深入讲解 ,有兴趣可以继续关注
    • 小礼物走一走 or 点赞
  • 相关阅读:
    c++ 启发式搜索解决八数码问题
    基于linux或windows的c/s的循环服务器求一元二次方程的根
    基于linux或windows平台上的c/s简单通信
    第七章总结
    第六章总结
    第五章总结
    第四章总结
    第一章总结
    第三章总结
    第二章总结
  • 原文地址:https://www.cnblogs.com/dashucoding/p/11932388.html
Copyright © 2011-2022 走看看