主要问题
opt-card 这个元素样式,本身设为了 display: inline-flex 现在我想让它超出不换行而是显示滚动条,如果使用默认的display:nowarp 则会导致子元素被极限压缩
所以最后给子元素加了 flex-shrink: 0; 这样就可以实现即不换行也不会压缩
可有可无的参照
这是大致的html结构
<div class="opt" data-v-d4948df9=""><div class="opt-card" data-v-d4948df9=""><div class="first-item" data-v-d4948df9="">加入方式</div><div class="success item" data-v-d4948df9="">离线</div><div class="success item" data-v-d4948df9="">正版</div><div class="success item" data-v-d4948df9="">白名单</div><div class="success item" data-v-d4948df9="">白名单</div><div class="success item" data-v-d4948df9="">白名单</div><div class="success item" data-v-d4948df9="">白名单</div></div><div class="opt-card" data-v-d4948df9=""><div class="first-item" data-v-d4948df9="">运营</div><div class="success item" data-v-d4948df9="">公益</div><div class="error item" data-v-d4948df9="">商业</div></div><div class="opt-card" data-v-d4948df9=""><div class="first-item" data-v-d4948df9="">世界规则</div><div class="success item" data-v-d4948df9="">不掉落</div><div class="success item" data-v-d4948df9="">不蔓延</div><div class="success item" data-v-d4948df9="">爆炸保护</div></div></div>
如图:
近期生活:
写代码从15年写到如今,我反而面临的是面试难,(即将流浪街头的感悟),哈哈,后端.Net方向再没什么好学的了,也就时不时追追新语法新类库
反而是微软的ts重新勾起我的兴趣,闲来无事则用vue3和ts来写写小网站