panchang199266的博客

  flex 弹性布局很好用，解决了我的排版问题，下面记录下我使用flex 弹性布局解决的一些常见问题，以供以后查阅！一、基本概念介绍（一）基本用法display: flex;flex-direction: row;justify-content: center;align-items: center;1、flex-direction  分布方向，有两个值：row：水平分布...

核心就是：flex: 0 0 33%;参见 flex布局实现每行固定div个数，并根据屏幕分辨率自适应布局

// 渐变色背景background-image linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8))

1.引入1像素边框的css文件border.css@charset "utf-8";.border,.border-top,.border-right,.border-bottom,.border-left,.border-topbottom,.border-rightleft,.border-topleft,.border-rightbottom,.border-topr...

主要用来解决项目布局使用的是自适应的布局方式，div给出的宽度是百分比的形式，即框占窗口宽度的50%，但边界和内边距是用像素来表示的怎么办的问题！参见 从box-sizing:border-box属性入手，来了解盒模型...

overflow: hidden white-space: nowrap text-overflow: ellipsis

·1.两排图标<template> <div class="icons"> <div class="icon"> <div class="icon-img"> <img class="icon-img-content" src="http://img1.quna...

// 创建一个宽高比为2:1的区域.icons { overflow: hidden; height: 0; padding-bottom: 50%; background: green;}核心就是利用 height: 0; 和 padding-bottom: 50%; 来控制当宽一定时，高的长度！...

<div class="parent-container"> <button class="bt-read">续读</button></div>.parent-container{ margin-left: 20rpx; /* 父容器必须是相对定位，子容器的绝对定位才能达到预想效果 */ position: rela...

写法如下： .login-form position absolute top 50% left 50% width 350px transform translate(-50%,-55%) padding 35px 35px 15px 35px border 1px solid #eaeaea ...