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 点赞
  • 相关阅读:
    在“安装”阶段发生异常。 System.Security.SecurityException: 未找到源,但未能
    [转]C# 实现Jwt bearer Authentication
    json序列化数据超出最大值(maxJsonLength)
    設計之家-教程
    Python Dom 的介绍和使用day1
    Python CSS day2
    回顾
    Python CSS day1
    Python HTML day2
    Python HTML day1
  • 原文地址:https://www.cnblogs.com/dashucoding/p/11932388.html
Copyright © 2011-2022 走看看