css--踩坑

1. 子元素的宽高不生效问题

设置flex布局后,子元素的宽高不生效问题。 如果希望子元素的宽高生效,解决方法,给子元素添加如下属性: flex-shrink: 0;

    flex-shrink: 0;

2. 横向滚动(子元素宽度不固定)

在这里插入图片描述
在这里插入图片描述

/* tab栏 */
.swiper-tab {
/* 1.最外面的元素设置固定宽度;以及滚动 */width: 100%;overflow-x: auto;height: 116rpx;text-align: center;display: flex;align-items: center;justify-content: space-between;background: #fff;padding: 0px 20rpx;box-sizing: border-box; 
}.menuTab {
/* 2.第二层的元素设置一个超过100%的宽度; */width: 140%; 
/* 设置flex布局后,子元素的宽高不生效问题。 如果希望子元素的宽高生效,解决方法,给子元素添加如下属性: flex-shrink: 0; */flex-shrink: 0;display: flex;flex-wrap: nowrap;align-items: center;justify-content: space-around; height: 100%;
}
/* 3.子元素不设置宽度,就是自适应的宽度; */
.selected-menu {  padding: 0 32rpx; height: 100%;font-size: 32rpx;font-family: PingFang SC;font-weight: bold; color: #151521;display: flex;flex-direction: column;align-items: center;justify-content: center;position: relative; 
}.unselect-menu { padding: 0 32rpx; height: 100%;font-size: 32rpx;font-family: PingFang SC; color: rgba(21, 21, 33, .5);display: flex;flex-direction: column;align-items: center;justify-content: center;position: relative; 
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/152155.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第2篇 机器学习基础 —(1)机器学习方式及分类、回归

前言:Hello大家好,我是小哥谈。机器学习是一种人工智能的分支,它使用算法和数学模型来使计算机系统能够从经验数据中学习和改进,而无需显式地编程。机器学习的目标是通过从数据中发现模式和规律,从而使计算机能够自动进…

国产开源无头CMS,MyCms v4.7 快捷生成接口开发后台

MyCms 是一款基于 Laravel 开发的开源免费的开源多语言商城 CMS 企业建站系统。 MyCms 基于 Apache2.0 开源协议发布,免费且可商业使用,欢迎持续关注我们。技术交流 QQ 群:887522124 加群请备注来源:如gitee、github、官网等 v4…

【SpringCloud】认识微服务

🐌个人主页: 🐌 叶落闲庭 💨我的专栏:💨 c语言 数据结构 javaEE 操作系统 Redis 石可破也,而不可夺坚;丹可磨也,而不可夺赤。 认识微服务 一、 服务架构演变1.1 单体架构…

Linux 磁盘管理+实例

目录 一、文件系统 二、添加磁盘 三、查看磁盘信息(块设备) 四、分区 1、格式 1)MBR分区 2)GPT分区 2、管理分区 1)使用fdisk 2)使用gdisk 3)使用parted a.交互式 b.非交互式 3、…

2023年中国CEM-3型覆铜板市场供需现状、销售收入及行业趋势分析[图]

CEM-3指覆铜板的一种,以玻纤布半固化片与玻纤粘半固化片层压铜箔达到固化形成的板材,属于复合型基材,CEM-3由于其良好的加工性能主要用于FR-4中厚板的替代,有着良好的发展前景。 随着CEM-3覆铜板品质的不断改进和提高,…

Springboot知识点必知必会(一)

mvc设计模式 MVC设计模式是Model-View-Controller的缩写,它是一种用于设计用户界面的软件设计模式。Spring MVC是Spring框架的一个模块,它提供了一种基于Java的方式来实现MVC设计模式。 以下是Spring MVC中MVC设计模式的组成部分和工作原理: …

什么是智能档案柜?如何使用智能档案柜?

智能档案柜是一种具有智能化功能的文件存储设备,它通过应用现代科技,集成了电子锁、自动化控制、智能管理系统技术,具有自动识别、高效存储、安全可靠等特点,提高档案管理的效率和安全性。适用于企业单位、图书馆等需要储存文件资…

安卓端App页面狂刷问题记录

一、场景 App基于webview混合开发,业务主要为前端h5实现,其中有一个功能为消息中心,当从通知栏点击消息跳转到指定页面时,前端会不停地刷新页面,一遍又一遍地重复同一批请求。 二、问题分析 1、刚开始怀疑是否前端里…

机器学习必修课 - 编码分类变量 encoding categorical variables

1. 数据预处理和数据集分割 import pandas as pd from sklearn.model_selection import train_test_split导入所需的Python库 !git clone https://github.com/JeffereyWu/Housing-prices-data.git下载数据集 # Read the data X pd.read_csv(/content/Housing-prices-data/t…

Mysql 8手动终止某个事务并释放其持有的锁

示范数据表 age具有index普通索引 在mysql数据库里的information_schema.INNODB_TRX表中存储有innodb的所有事务,我们可以查看该表来查看正在进行的事务 现在我开启一个事务,执行第1、2行SQL,启动事务并持有id3的行锁 刷新事务表可以看到…

light client轻节点简介

1. 引言 前序博客: Helios——a16z crypto构建的去中心化以太坊轻节点 去中心化和自我主权对于Web3的未来至关重要,但是这些理想并不总适用于每个项目或应用程序。在非托管钱包和bridges等工具中严格优先考虑安全性而不是便利性的用户,可选…

C++ 01.学习C++的意义-狄泰软件学院

一些历史 UNIX操作系统诞生之初是用汇编语言编写的随着UNIX系统的发展,汇编语言的开发效率成为瓶颈,所以需要一个新的语言替代汇编语言1971年通过对B语言改良,使其能直接产生机器代码,C语言诞生UNIX使用C语言重写,同时…

基于Stable Diffusion的图像合成数据集

当前从文本输入生成合成图像的模型不仅能够生成非常逼真的照片,而且还能够处理大量不同的对象。 在论文“评估使用稳定扩散生成的合成图像数据集”中,我们使用“稳定扩散”模型来研究哪些对象和类型表现得如此逼真,以便后续图像分类正确地分配…

[尚硅谷React笔记]——第3章 React应用(基于React脚手架)

目录: react脚手架创建项目并启动react脚手架项目结构一个简单的Hello组件样式的模块化功能界面的组件化编码流程(通用)组件的组合使用-TodoList 1.react脚手架 xxx脚手架: 用来帮助程序员快速创建一个基于xxx库的模板项目 包含了所有需…

/lib64/libstdc++.so.6: version `GLIBCXX_3.4.21‘ not found (required by

在某项目中遇到下面的错误, ./model2trt_v2: /lib64/libstdc.so.6: version GLIBCXX_3.4.21 not found (required by ./model2trt_v2) ./model2trt_v2: /lib64/libstdc.so.6: version GLIBCXX_3.4.21 not found (required by ../../../lib/linux_lib/libcuda_utils…

WPF中DataContext的绑定技巧

先看效果: 上面的绑定值都是我们自定义的属性,有了以上的提示,那么我们可以轻松绑定字段,再也不用担心错误了。附带源码。 目录 1.建立mvvm项目 2.cs后台使用DataContext绑定 3.xaml前台使用DataContext绑定 4.xaml前台使用Da…

浏览器自动化神器:Automa 轻松实现任务编排 | 开源日报 No.52

usememos/memos Stars: 13.8k License: MIT memos,一个轻量级的、自托管的备忘录中心。开源且永久免费。 开源且永久免费使用 Docker 可以在几秒钟内完成自我托管支持 Markdown 格式可定制和共享提供 RESTful API 用于自助服务 mamoe/mirai Stars: 12.6k Licen…

华为云云耀云服务器L实例评测 | 实例使用教学之高级使用:配置 Git SSH Key 进行自动识别拉代码

华为云云耀云服务器L实例评测 | 实例使用教学之高级使用:配置 Git SSH Key 进行自动识别拉代码 介绍华为云云耀云服务器 华为云云耀云服务器 (目前已经全新升级为 华为云云耀云服务器L实例) 华为云云耀云服务器是什么华为云云耀云…

Mac解压缩软件BetterZip免费版注册码下载

软件介绍 BetterZip免费版是一款适用于Mac系统的解压缩软件,软件具备了专业、实用、简单等特点,它可以让用户更快捷的向压缩文件中添加和删除文件,同时兼容性也十分优秀,支持ZIP , SIT , TAR、BZIP2 &…

30分钟快速搭建并部署一个免费的个人博客

1前言 现如今网上有许多完善的博客平台,如博客园、掘金、思否、知乎等。有人会说为什么现在网上有这么多成熟的博客平台,你还要浪费时间搭建一个自己的博客系统呢?首先我相信每一个程序员都会想要拥有一个属于自己的博客系统,其次…