乱七八糟的东西

100 阅读3分钟

{

    "background.enabled": true,

    "background.useDefault": false,

    "bracketPairColorizer.depreciation-notice": false,

    "tabnine.experimentalAutoImports": true,

    "background.customImages":["file:///E:/0220104192032.png"],

    "background.useFront": false,

    "background.style": {

        "margin": "0 auto",

        "top": "0",

        "left": "0",

        "width": "100%",

        "height": "100%",

        "z-index": "99999",

        "background.repeat": "no-repeat",

        "background-size": "cover",

        "opacity": 0.3 // 透明度

    }

}

vue 解决ios端H5页面放大问题和element ui 计数器能唤起键盘

1.放大问题:在index.html加入

2.唤起键盘:

pointer-events: none;

将json格式的数据转换成表单格式

  var params = {}

  // debugger

  let formDataTo = new FormData;

  for (let key in params) {

    formDataTo.append(key, params[key]);

  }

  console.log(formDataTo)

[vue跳转外部链接](https://www.cnblogs.com/pwindy/p/14627475.html)

var url = 'www.baidu.com'

window.open(url,"_blank");

?version=1.0.1 //解决钉钉浏览器缓存问题

vue隔行换色 medicalHeaderS 样式名

:class="{medicalHeaderS:index%2==0,medicalHeaderSB:index%2!=0}"

vue 鼠标划入变背景颜色

班子分析

active: '',

mouseOver() {

this.active = 'background-color: rgba(29, 142, 237, 0.4)';

},

mouseLeave() {

this.active = '';

},

获取url中"?"符后的字符串包括‘?’

var url = location.search; //获取url中"?"符后的字符串包括‘?’ ,window.location.href获取的是url完整的字符串

var code = url.substring(6)

父元素display:flex布局下的子元素宽度无效问题

因为flex属性默认值为flex:0 1 auto;其中 1 为 flex中的 flex-shrink 属性。

该属性介绍:

一个数字,规定项目将相对于其他灵活的项目进行收缩的量。

根据上述介绍可以理解为默认 1 为开启收缩

所以可以将display:flex;下的子元素的flex属性设置为flex:0 0 auto;

解决了display:flex下的子元素设置宽度无效的问题。

align-items: center;//弹性盒模型水平垂直居中

瀑布流布局

width: 750rpx;

height: 100Vh;

display: flex;

flex-flow:column wrap;

----------------------------------------------------------------------

结构伪类选择器(css3)

:first-child:选取父元素的首个子元素的指定选择器

:last-child:选取父元素的最后一个子元素的制定选择器

:nth-child(n):匹配属于父元素的第N个子元素,不论元素的类型

:nth-last-child(n):匹配从父元素最后一个子元素开始倒数的子元素

————————————————

伪类选择器首个元素样式不要

.service-evaluation-title{

  font-size: 30rpx;

  font-weight: 600;

  padding-left:70rpx ;

}

.service-evaluation-title:first-child{

  font-size: 30rpx;

  font-weight: 600;

  padding-left:0;

}

----------------------------------------------------------------------

字体倒影

-webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.3));

font:bold 40px/1.231 georgia,sans-serif;

text-transform:uppercase;

---------------------------------------------

cursor: pointer; vue 鼠标 变手

font-style:italic;字体倾斜

imgUrl: require("../../../static/img/my_chengfa3x.png")解决打包后图片不显示的问题(静态资源时)

   背景透明度1

  background: black;

    opacity: 0.4;

背景透明度2

background-color: rgba(0, 0, 0, 0.4);

font-size:20rpx ;

transform: scale(0.9);//font-size最小z

   border-radius:5px; 倒角属性

  letter-spacing:2px;字间距属性

font-weight:800;字体加粗

html中随机生成假文:输入Lorem按tab键

text-indent : 20px; 字体缩进了20px

!important;css中权限最高 覆盖一切

max-width:100px;设置段落的最大宽度

[background-image](http://www.divcss5.com/rumen/r125.shtml):url() ;//引入背景图片

[background-repeat](http://www.divcss5.com/rumen/r125.shtml):no-repeat ;//设置背景图片是否重复平铺

background-size: 100% 100%; //设置背景图片大小

background-image: linear-gradient(to right, red , yellow); 渐变的背景颜色

![]()

//图片居中

居中

//transform:translateY

position: absolute;

transform:translate(-50%);

left: 50%;

水平垂直居中

position: relative;

transform: translate(-50%, -50%);

left: 50%;

top: 50%;

------------------------

input::-webkit-input-placeholder{color: #C6C6C6;} 改变input提示文的颜色

maxlength="11" input限制长度

style="text-align:right;" 让input提示文居右

//input加上type="password"可以让内容变成星号

div实现背景色和背景图片同时存在:

{ background-color: #fff; background-image:url('../../assets/img/model-bg.png'); background-repeat: no-repeat; }

height:100%,不生效?

此时应该在App.vue文件style中添加如下代码:

html,body,#app{

 

 height: 100%;

 

}

去除ios 手机端input输入框的内阴影

input{ -webkit-appearance: none; }