MELANCHOLY ❤ ◁ ❚❚ ▷

【代码】css 画个斜线背景。

微信小程序 自定义弹窗展示图表组件（echarts/AntV-f6）

css3 background-clip 背景色裁剪，显示范围；css背景图不含padding。

超短期简单甘特图，自定义简单甘特图。

谷歌浏览器input输入框背景透明色 input:-internal-autofill-selected。

外部div高度自适应 内部一个【固定高】另一个【自适应高度】1.flex外:display: flex; flex-direction: column;固:height:100px;自:flex-grow: 1;2.position外:position: relative;固:height:100px;自:position: absolute; top: 100px; bottom: 0; width: 100%; 或者 left:0;right:0..

多个相同class的元素，（点击）操作后，当前事件单独发生子元素发生事件 $(this).children()<li class="dropdown"> <a>导航<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="">二级</a></li> </ul></l

li宽度固定，数量不固定，ul宽度随li数量变化width:max-content 内部元素最大宽度作为最终容器的宽度。出现文本即为文本不换行用于ul导航栏可自适应li<div class="head_nav" style="overflow-x: scroll;width: 100%;"> <ul style="width: max-content;padding: 0;"> <li style="width: 60px;list-style: none;

css属性 overflow：overflow：visible 默认，超出显示overflow：hidden 超出范围隐藏overflow：scroll 范围内容带滚动条overflow：auto 范围内容若超出带滚动条内容超出范围，出现滚动条 overflow:scroll/auto横向滑动导航栏 overflow-x:scroll/auto横向滑动外层(div)，内层(ul) 。内层宽度包含全部内容且大于外层<div class="head_nav" >

常见做法，border边框 width: 0; height: 0; border-style: solid; border-width: 40px; border-color: red black #6d73a2 yellow;/-------------------------------------------------------------- width: 0; height: 0; border-bottom: 50px solid

<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1,user-scalable=no" />/*Common For Max 1366*/@media only screen and (max-width: 1499px) {}/*Common For Max 1200*/@media only screen and (max-width: 1365px) {}/*Co

object-fit css属性，可以对照片剪裁并保留原有尺寸<img src="{{$tag->logo}}" alt="{{$tag->name}}" style="width: 150px;object-fit:contain">

行内元素或将块级元素变为行内元素后，会有错位的现象。加vertical-align给个基准线对齐

css文本属性

超出部分变省略号单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap;多行文本 display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;

可以引用线上生成链接，也可以下载本地引用本地文件1. 进官网阿里巴巴矢量图库 查找需要的logo2. 将需要的logo添加入库3. 将购物车内项目添加进项目，没有就新建4. 去我的项目5. 直接在文件中引入线上链接的方法，点击生成线上链接文件中引入（加上http:）（class 的命名就是官网上logo的名字）6. 下载文件引入方法，避免外部链接。点击下载至本地，打开压缩包，引用的为 iconfont.css 文件7. 文件直接引入本地文件就可以，命名css文件.

1.绝对定位+margin:auto图片相对外层产生浮动，利用margin:auto<div class="logo"><img src="#" /></div>.logo{ width: 30%; height: 120px; position: relative;}.logo img{ position: absolute; top: 0; bottom: 0; left: 0; right: 0;

css 页面滚动动画 wow.js页面根据滚动条变化展现动画官网链接https://www.delac.io/wow/使用时需要引入wow.js或wow.min.js 以及animate.css或者animate.min.css文件下载链接https://github.com/matthieua/WOW 使用方法引入，初始化 <link rel="stylesheet" type="text/css" href="css/animate.min.css">