css
zuo-yiran
这个作者很懒,什么都没留下…
展开
-
关于css中flex布局垂直居中失效问题的原因
flex布局垂直居中失效原因原创 2024-07-19 14:29:49 · 438 阅读 · 0 评论 -
css 步骤条虚线渐变色效果实现
css步骤条虚线渐变色原创 2024-05-13 11:28:48 · 346 阅读 · 0 评论 -
关于IE11的样式兼容问题记录
1、布局如下<div class="map-label" :class="{active:isActive}" :style="{marginTop:`${marTopVal}px`}"> <transition name="slide-fade"> <div class="transition-out" v-if="show"> <div class="circle-out" :style="{left:circleLeft,top:circleTo原创 2023-06-28 15:07:09 · 844 阅读 · 0 评论 -
css样式实现:带边框的平行四边形
效果:html:<ul class="tab-right"> <li @click="tabAll('factory',index)" class="tab-li" v-for="(item,index) in factoryList" :key="index"> <div :class="{checked:factoryIndex==index}" class="tab-in">{{item.name}}</div> &原创 2021-05-31 08:51:13 · 1241 阅读 · 0 评论 -
H5移动端适配屏幕(ios和android)
全面屏手机把整个webview(包括状态栏)给H5的话,不对状态栏进行控制往往会有以下如图问题出现,这样头部的返回按钮置于页面的安全区外,无法进行操作。有问题的想要的效果:具体的实现:针对ios的刘海屏问题的解决:一、设置网页在可视窗口的布局方式(重点是添加:viewport-fit=cover)<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, m原创 2020-09-08 14:45:21 · 8123 阅读 · 3 评论 -
css样式实现:左上方带标记三角的四边拼接图形
效果:html:<div class="category-area"> <ul class="category-ul"> <li @click="tabAll('gas',index)" class="category-li" :class="{'checked':index==gasIndex}" v-for="(item,index) in GasProductionData" :key="index"> <原创 2020-08-05 09:39:38 · 385 阅读 · 0 评论 -
解决html中标签自带的间距
以上截图中明显看到标签之间自带的有间距,解决这个问题有两个方法:1.用float浮动但是由于项目实际需要这个高度,所以不能使用float,另一种方法如下:2.给ul添加样式font-size: 0;这样li之间的间隔就会消失,但是需要重新给li添加font-size...原创 2020-06-02 11:11:34 · 2730 阅读 · 0 评论 -
手机端css实现横向滚动但不显示滚动条
要实现手机端的横向滚动,但显示滚动条,如下图:要实现滚动条消失,但是依然可以滚动,代码如下:<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><meta name="viewport" cont原创 2019-03-12 09:24:07 · 5656 阅读 · 0 评论 -
html自定义弹窗实现图片高度自适应
实际效果: 点击 实现 再次点击则弹窗消失。 弹窗布局为:&lt;div class="box"&gt; &lt;img class="img" id="img" src=""/&gt;&lt;/div&gt;css样式为:.bo原创 2018-06-06 17:58:23 · 3460 阅读 · 0 评论 -
取消可输入标签聚焦时contenteditable的边框
把普通标签改为可输入的标签时添加contenteditable=”true”即可实现输入功能,但是进行输入时会有边框出现,如: 想要去掉的话只需给标签加上 outline: none;即可原创 2017-02-21 09:09:33 · 8493 阅读 · 2 评论