css+html横向滚动+固定宽

 没什么好说的,快上代码!

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<style>
	.box{
		border:1px solid  #ccc;
		width:900px;  
		height:150px;
		margin: 300px 	auto;
		white-space:nowrap;
		overflow-x: scroll;
	}
	.item{
		/* display: flex;
		flex-shrink: 0; 禁用收缩 */
		display: inline-block;
		background:#36d;
		width: 300px;
		height:100px;
		border:1px solid #eee;
	}
</style>
<body>
	<!-- 
		横向滚动子属性固定宽度
	 -->
	<div class="box">
		<div class="item"></div>
		<div class="item"></div>
		<div class="item"></div>
		<div class="item"></div>
		<div class="item"></div>
		<div class="item"></div>
	</div>
</body>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2023.12.16 帆软report 官方模板表练习,pymysql

import pymysql# 建立与数据库的连接 conn1 pymysql.connect(host192.168.88.100,port3306,userroot,password123456,dbshopnc_db ) conn2 pymysql.connect(host192.168.88.100,port3306,userroot,password123456,dbbi_db ) # 2.创建游标对象 c1 conn1.cursor() # 3.编写sql…

OpenSSL 3.2.0新增Argon2支持——防GPU暴力攻击

1. 引言 OpenSSL新发布的3.20版本中&#xff0c;引入了一些新特性&#xff0c;包括&#xff1a; post-quantum方法Brainpool曲线QUICArgon2&#xff1a;Argon2 是一种慢哈希函数&#xff0c;在 2015 年获得 Password Hashing Competition 冠军&#xff0c;利用大量内存计算抵…

【面试】Java最新面试题资深开发-微服务篇(1)

问题九&#xff1a;微服务 什么是微服务架构&#xff1f;它与单体架构相比有哪些优势和劣势&#xff1f;解释一下服务发现和服务注册是什么&#xff0c;它们在微服务中的作用是什么&#xff1f;什么是API网关&#xff08;API Gateway&#xff09;&#xff1f;在微服务中它有何…

[学习笔记]批量迁移数据库文件

拷贝数据库文件 首先在本地运行如下SQL语句&#xff0c;查看数据库文件的磁盘位置 SELECT name, physical_name AS CurrentLocation, state_desc FROM sys.master_files默认是保存在C:\Program Files\Microsoft SQL Server\MSSQL13.MSSQLSERVER\MSSQL\DATA目录下 首先复制数据…

mybatis.interceptor.exception.SqLValidateException:Ilegal SQL::......

现象&#xff1a;⬇️ 描述&#xff1a;执行 SQL 没问题&#xff0c;应用代码报错 ⬇️ .mybatis.interceptor.exception.SqLValidateException&#xff1a;Ilegal SQL::SELECT voucherNo FROM voucher ORDER BY CAST(SUBSTRING(voucherNo FROM LOCATE(_, voucherNo) 1) AS U…

C语言KR圣经笔记 4.4作用域规则 4.5头文件 4.6静态变量

4.4 作用域规则 构成一个 C 程序的函数以及外部变量&#xff0c;不需要全都同时编译&#xff1b;程序的源代码可以放在多个源文件中&#xff0c;并且之前编译好的例程可以从库里面加载。需要关心的问题有&#xff1a; 要怎么写声明&#xff0c;才能使变量在编译期间被正确声明…

网络编程『socket套接字 ‖ 简易UDP网络程序』

&#x1f52d;个人主页&#xff1a; 北 海 &#x1f6dc;所属专栏&#xff1a; Linux学习之旅、神奇的网络世界 &#x1f4bb;操作环境&#xff1a; CentOS 7.6 阿里云远程服务器 文章目录 &#x1f324;️前言&#x1f326;️正文1.预备知识1.1.IP地址1.2.端口号1.3.端口号与进…

三菱plc学习入门(一,认识三菱plc)

今天就开始对三菱的plc软件入一个门&#xff0c;希望小编的文章对读者和初学者有所帮助&#xff01;欢迎评论指正&#xff0c;废话不多说&#xff0c;下面开始学习。 目录 plc的型号介绍 M表示什么&#xff1f; T表示什么&#xff1f; R表示什么&#xff1f; 为什么三菱没…

Pytorch nn.Linear()的基本用法与原理详解及全连接层简介

主要引用参考&#xff1a; https://blog.csdn.net/zhaohongfei_358/article/details/122797190 https://blog.csdn.net/weixin_43135178/article/details/118735850 nn.Linear的基本定义 nn.Linear定义一个神经网络的线性层&#xff0c;方法签名如下&#xff1a; torch.nn.Li…

得帆信息创始人-张桐,受邀出席 BV百度风投AIGC主题论坛

近日&#xff0c;得帆信息创始人兼CEO张桐&#xff0c;作为百度风投被投代表企业创始人受邀出席“向未来&#xff0c;共成长” BV百度风投AIGC主题论坛。 与包括上海市徐汇区相关部门领导、百度集团相关事业部负责人及代表&#xff0c;以及来自国寿资本、中网投、麦顿投资的投资…

install cuda cudnn tersorRT

# 安装 $ ubuntu-drivers devices$ sudo apt-get install nvidia-driver-470-server # 推荐是server&#xff0c;都可以。#delelt sudo apt --purge remove nvidia-* CUDA Toolkit Archive | NVIDIA Developerhttps://developer.nvidia.com/cuda-toolkit-archive CUDA Toolk…

【计算机网络】TCP协议——1.报文格式详解

前言 上篇讲解了UDP报文格式。TCP和UDP是同层协议&#xff0c;都属于传输层&#xff0c;数据来源于上层——应用层 目录 一. TCP协议概述 二. TCP报文格式 1. 两个问题 2. 确认号和序列号 3. 标志位字段 4. 窗口大小 5. 校验和字段 6. 紧急指针与紧急数据 7. 选项字…

后端低代码平台探索总结

业务需求快速变化的背景 我们在对业务需求进行梳理后&#xff0c;在进行程序设计时&#xff0c;对于将来可能发生变化的常量、变量、阀值、开关、条件、公式等等&#xff0c;可能会配置在环境变量或数字字典来支持可配置。但是需求变化往往会更加复杂、更加不可预测&#xff0…

PDF控件Spire.PDF for .NET【转换】演示:将多个图像转换为单个 PDF

如果您想要将多个图像合并为一个文件以便于分发或存储&#xff0c;将它们转换为单个 PDF 文档是一个很好的解决方案。这一过程不仅节省空间&#xff0c;还确保所有图像都保存在一个文件中&#xff0c;方便共享或传输。在本文中&#xff0c;您将学习如何使用Spire.PDF for .NET …

VuePress安装及使用

目录 前言一、依赖环境二、vuepress 安装和使用1.初始化2.将 VuePress 安装为本地依赖3. package.json 中添加脚本4. 新建 docs 文件夹5.启动6. 效果 三、进阶使用1.新增配置文件2.安装搜索插件3.config.js 中增加配置4.效果展示5.注意 前言 VuePress 是一个以 Markdown 为中心…

Vue中英文翻译小结

背景&#xff1a;时局艰难&#xff0c;后端开发被强制写了vue&#xff0c;这不有个需求是中英文翻译&#xff0c;特此记录下&#xff0c;该怎么个翻译法子。 先引入全局的路由国际化文件&#xff0c;zh.js 和 en.js 1.关于插值表达Button里面 {{ $t(reinsop.common.back) }} …

软件测试技术分享| Appium用例录制

下载及安装 下载地址&#xff1a; github.com/appium/appi… 下载对应系统的 Appium 版本&#xff0c;安装完成之后&#xff0c;点击 “Start Server”&#xff0c;就启动了 Appium Server。 在启动成功页面点击右上角的放大镜&#xff0c;进入到创建 Session 页面。配置好…

❀My虚拟机上的ftp服务器搭建(centos)❀

❀My虚拟机上的ftp服务器搭建(centos)❀ 在CentOS上搭建FTP服务器可以使用vsftpd软件&#xff0c;下面是详细的搭建教程&#xff1a; ①安装vsftpd软件 在终端中输入以下命令进行安装&#xff1a; sudo yum install vsftpd ②配置vsftpd 打开vsftpd的配置文件&#xff0c;…

Apache Flume(5):多个agent模型

可以将多个Flume agent 程序连接在一起&#xff0c;其中一个agent的sink将数据发送到另一个agent的source。Avro文件格式是使用Flume通过网络发送数据的标准方法。 从多个Web服务器收集日志&#xff0c;发送到一个或多个集中处理的agent&#xff0c;之后再发往日志存储中心&…

互联网加竞赛 python+opencv+深度学习实现二维码识别

0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; pythonopencv深度学习实现二维码识别 &#x1f947;学长这里给一个题目综合评分(每项满分5分) 难度系数&#xff1a;3分工作量&#xff1a;3分创新点&#xff1a;3分 该项目较为新颖&…