首页 LOGO


LOGO
预览效果
  • HTML
  • SCSS
  • CSS
  • UniApp
<div class="ul-logo">
    <div class="main">
        <div class="title">AI</div>
        <div class="plus">AI帮手</div>
    </div>
</div>
.ul-logo {


    $baseSize: 40px;

    background-color: #1E9FFF;

    border-radius  : calc($baseSize / 3);
    display        : flex;
    align-items    : center;
    justify-content: center;

    width      : calc($baseSize * 2);
    height     : calc($baseSize * 2);
    text-align : center;
    color      : #fff;
    white-space: nowrap;

    .title {
        font-size: $baseSize;
    }

    .plus {
        font-size: clac($baseSize / 2);
    }
}
.ul-logo {
  background-color: #1E9FFF;
  border-radius: calc($baseSize / 3);
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc($baseSize * 2);
  height: calc($baseSize * 2);
  text-align: center;
  color: #fff;
  white-space: nowrap;
}
.ul-logo .title {
  font-size: 40px;
}
.ul-logo .plus {
  font-size: clac(40px/2);
}
<view class="ul-logo">
    <view class="main">
        <view class="title">AI</view>
        <view class="plus">AI帮手</view>
    </view>
</view>