当前位置: 首页 > news >正文

css布局之flex应用

左右分割,左边占90%,右边占10%
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/bf85511b632648f6a29b13b495dfc03f.p

		/*父  100*/.parent-div {/* 这里添加你想要的属性 */display: flex;flex-direction: row; //行justify-content: space-between; //左右对齐align-items: center;flex-wrap: wrap; //换行}/*中 90 +10 */.middle-div {/* 这里添加你想要的属性 */display: flex;flex-direction: row;align-items: center;flex-wrap: wrap;}/*子 每一个小div */.son-div {/* 这里添加你想要的属性 */flex-direction: row;margin: 5px 10px;}
<div class="form-group parent-div"   ><div class="middle-div" style="width: 90%; justify-content: left;"><div class="son-div"><a  class="search-button"  >导出</a></div><div class="son-div"><input type="text" id="dc_ids"   class="form-control" style="width: 185px;" ></div>                         </div><div class="middle-div"  style="width: 10%;justify-content: right;flex-direction: row"><div class="son-div"><a  class="search-button"  >读卡</a></div><div class="son-div"><a  class="search-button"  >查询</a></div></div></div>

相关文章:

css布局之flex应用

/*父 100*/.parent-div {/* 这里添加你想要的属性 */display: flex;flex-direction: row; //行justify-content: space-between; //左右对齐align-items: center;flex-wrap: wrap; //换行}/*中 90 10 */.middle-div {/* 这里添加你想要的属性 */display: flex;flex-direction:…...

树莓派4B设置AP热点步骤

树莓派4B设置AP热点步骤&#xff1a;先进入root模式 预先进行apt-get update 第1步&#xff1a;安装network-manager ​sudo apt-get install network-manager第2步&#xff1a;安装git apt-get install git apt-get install util-linux procps hostapd iproute2 iw haveged …...

Java程序之百鸡百钱问题

题目&#xff1a; 百钱买百鸡的问题算是一套非常经典的不定方程的问题&#xff0c;题目很简单&#xff1a;公鸡5文钱一只&#xff0c;母鸡3文钱一只&#xff0c;小鸡3只一文钱&#xff0c;用100文钱买一百只鸡,其中公鸡&#xff0c;母鸡&#xff0c;小鸡都必须要有&#xff0c;…...

Mybatis——动态sql

if标签 用于判断条件是否成立。使用test属性进行条件判断&#xff0c;如果条件为true&#xff0c;则拼接sql。 <where>标签用于识别语句是否需要连接词and&#xff0c;识别sql语句。 package com.t0.maybatisc.mapper;import com.t0.maybatisc.pojo.Emp; import org.a…...

可视化大屏开发系列——页面布局

页面布局是可视化大屏的基础&#xff0c;想要拥有一个基本美观的大屏&#xff0c;就得考虑页面整体模块的宽高自适应&#xff0c;我们自然就会想到具有强大灵活性flex布局&#xff0c;再借助百分比布局来辅助。至此&#xff0c;大屏页面布局问题即可得到解决。 可视化大屏开发系…...

Python statistics 模块

Python 的 statistics 模块提供了一组用于执行各种统计计算的函数&#xff0c;包括平均值、中位数、标准差、方差以及其他统计量。让我来简单介绍一下。 首先&#xff0c;你可以使用以下方式导入 statistics 模块&#xff1a; python import statistics 接下来&#xff0c;…...

wireshark常见使用表达式

目录 1. 捕获过滤器 (Capture Filters)基本捕获过滤器组合捕获过滤器 2. 显示过滤器 (Display Filters)基本显示过滤器复杂显示过滤器协议特定显示过滤器 3. 进阶显示过滤器技巧使用函数和操作符逻辑操作符 4. 常见网络协议过滤表达式示例HTTP 协议HTTPS 协议DNS 协议DHCP 协议…...

用Java获取键盘输入数的个十百位数

这段Java代码是一个简单的程序&#xff0c;用于接收用户输入的一个三位数&#xff0c;并将其分解为个位、十位和百位数字&#xff0c;然后分别打印出来。下面是代码的详细解释&#xff1a; 导入所需类库: import java.util.Scanner;&#xff1a;导入Scanner类&#xff0c;用于从…...

第10章 启动过程组 (制定项目章程)

第10章 启动过程组 9.1制定项目章程&#xff0c;在第三版教材第356~360页&#xff1b; 文字图片音频方式 视频12 第一个知识点&#xff1a;主要输出 1、项目章程&#xff08;重要知识点&#xff09; 项目目的 为了稳定与发展公司的客户群(抽象&#xff0c;非具体) 可测量的项目…...

html侧导航栏客服栏

ico 替换 ICO <html xmlns"http://www.w3.org/1999/xhtml"><head><meta http-equiv"Content-Type" content"text/html; charsetutf-8"><title>返回顶部</title><script src"js/jquery-2.0.3.min.js"…...

Clonable接口和拷贝

Hello~小伙伴们&#xff01;本篇学习Clonable接口与深拷贝&#xff0c;一起往下看吧~(画图水平有限&#xff0c;两张图&#xff0c;&#xff0c;我真的画了巨久&#xff0c;求路过的朋友来个3连~阿阿阿~~~) 目录 1、Clonable接口概念 2、拷贝 2、1浅拷贝 2、2深拷贝 1、Clon…...

关于小蛋の编程和小蛋编程为同一作者的说明

小蛋の编程和小蛋编程的作品为同一人制作&#xff0c;因前者为父母的手机号进行注册&#xff0c;现用本人手机号注册了新账号小蛋编程&#xff0c;后续文章将在新账号小蛋编程上进行刊登&#xff0c;同时在小蛋编程上对原账号文章进行转载。此账号不再发布帖子&#xff0c;请大…...

大数据平台之Spark

Apache Spark 是一个开源的分布式计算系统&#xff0c;主要用于大规模数据处理和分析。它由UC Berkeley AMPLab开发&#xff0c;并由Apache Software Foundation维护。Spark旨在提供比Hadoop MapReduce更快的处理速度和更丰富的功能&#xff0c;特别是在处理迭代算法和交互式数…...

How to use ModelSim

How to use ModelSim These are all written by a robot Remember, you can only simulate tb files....

【专业英语 复习】第8章 Communications and Networks

1. 单选题 One of the most dramatic changes in connectivity and communications in the past few years has been ____. A. widespread use of mobile devices with wireless Internet connectivity B. chat rooms C. satellite uplinks D. running programs on rem…...

运行vue3项目相关报错

1. VSCode打开TSVue3项目很多地方报错 报错内容 几乎所有文件都会出现未知飘红 error Delete CR prettier/prettier报错原因 插件冲突&#xff0c;Windows系统回车换行符与MAC不一致&#xff08;所以这个问题Windows系统才会出现&#xff09; 解决 需要安装Vue - Official…...

2024年6月计算机视觉论文推荐:扩散模型、视觉语言模型、视频生成等

6月还有一周就要结束了&#xff0c;我们今天来总结2024年6月上半月发表的最重要的论文&#xff0c;重点介绍了计算机视觉领域的最新研究和进展。 Diffusion Models 1、Autoregressive Model Beats Diffusion: Llama for Scalable Image Generation LlamaGen&#xff0c;是一个…...

Centos Stream9 和Centos Stream10的下载网址

Index of /https://mirror.stream.centos.org/...

chrome 录制器及性能分析工具的使用

需求背景&#xff1a; 对比不同VPN方案网络延迟的差异。 验证工具&#xff1a; chrome浏览器自带的录制器、性能插件可以完美的解决这个问题。 注意&#xff1a;录制的操作都在当前页面&#xff0c;不存在新开标签页的场景 解决方案&#xff1a; 使用chrome录制器&#xf…...

如何打造稳定、好用的 Android LayoutInspector?

速度极慢&#xff0c;遇到复杂的布局经常超时 某些情况无法选中指定的 View 本文将围绕 LayoutInspector 的痛点&#xff0c;分析问题并修复&#xff0c;最终将 LayoutInspector 变成一个稳定、好用的插件。 二、加速 Dump View Hierarchy 2.1 问题描述 开发复杂业务的同学…...

C++ Thead互斥量死锁,mutex如何防止死锁---C++11多线程快速学习

假设有两个线程 T1 和 T2&#xff0c;它们需要对两个互斥量 mtx1 和 mtx2 进行访问&#xff0c;而且需要按照以下顺序获取互斥量的所有权&#xff1a; - T1 先获取 mtx1 的所有权&#xff0c;再获取 mtx2 的所有权。 - T2 先获取 mtx2 的所有权&#xff0c;再获取 mtx1 的所有…...

Ubuntu 之Glade图形化设计器

演示环境说明&#xff1a;本机使用Windows 11 家庭版本搭载 Ubuntu 22.04.4 LTS 子系统&#xff0c;同时并安装Ubuntu桌面虚拟化软件XLaunch。 如果没有搭建好上述问题&#xff0c;请参考&#xff1a;windows11子系统Ubuntu 22.04.4子安装图形化界面 Glade是什么&#xff1f;…...

152. 乘积最大子数组

152. 乘积最大子数组 题目链接&#xff1a;152. 乘积最大子数组 代码如下&#xff1a; class Solution { public:int maxProduct(vector<int>& nums) {int resnums[0];vector<int> f(nums.size()1,0),g(nums.size()1,0);f[0]nums[0],g[0]nums[0];for(int i1…...

proactor模式

Proactor模式是一种异步I/O的设计模式&#xff0c;它允许程序直接发起一个异步I/O操作并立即返回&#xff0c;而不需要等待该操作完成。一旦I/O操作实际完成&#xff0c;系统会通知相应的完成处理程序&#xff08;Completion Handler&#xff09;&#xff0c;该处理程序随后执行…...

Charles抓包工具

一、charles简介 1&#xff0c;charles是什么 Charles中文名叫青花瓷&#xff0c;它是一款基于HTTP协议的代理服务器&#xff0c;通过成为电脑或者浏览器的代理&#xff0c;然后截取请求和请求结果达到分析抓包的目的。 特点:跨平台、半免费 2&#xff0c;charles工作原理 前…...

RabbitMQ如何保证消息可靠

解决办法&#xff1a; 1、做好消息确认机制&#xff08;pulisher、consumer[手动ACK]&#xff09; 2、每一个发送的消息都在数据库做好记录。定期将失败的消息再次发送一遍 消息确认机制&#xff1a; 生产者确认模式&#xff1a;确认消息是否发送到broker&#xff0c;失败…...

学习笔记——路由网络基础——路由的高级特性

七、路由的高级特性 1、路由迭代(路由递归) 路由必须有直连的下一跳才能够指导转发&#xff0c;静态路由或BGP路由的下一跳可能不是直连的邻居&#xff0c;因此需要计算出一个直连的下一跳和对应的出接口&#xff0c;这个过程就叫做路由迭代(路由递归)。 添加一条去往20.1.1.…...

网络编程之XDP、TC和IO_URING以及DPDK

一、网络编程常见的技术 在前面已经分析过了XDP、TC和eBPF。也基本把三者间的关系理清了&#xff0c;但现在又有一个疑惑涌了上来。在前面提到过的IO_URING和DPDK与这些技术有什么关系呢&#xff1f;其实只要认真的看过分析文章可能大家心里都已经基本清楚了。 正如在前面不断…...

晶谷高温烧结导电浆料用低熔点玻璃粉 晶谷耐高温导电漆导电油墨高温玻璃粉

晶谷浆料玻璃粉是一种用于电子浆料的材料&#xff0c;它在电子浆料中起到粘结和降低烧结温度的作用&#xff0c;能够提高浆料与基材之间的结合力。 浆料玻璃粉的性能特点包括&#xff1a; - 软化点&#xff1a;软化点在350至650度之间。 - 热膨胀系数&#xff1a;热膨胀系数…...

【Mysql】DQL操作单表、创建数据库、排序、聚合函数、分组、limit关键字

DQL操作单表 1.1 创建数据库 •创建一个新的数据库 db2 CREATE DATABASE db2 CHARACTER SET utf8;•将db1数据库中的 emp表 复制到当前 db2数据库 ** 1.2 排序** 通过 ORDER BY 子句,可以将查询出的结果进行排序 (排序只是显示效果,不会影响真实数据) 语法结构&#xff1a;…...

网站前端浏览器兼容如何做/营销网站建设多少钱

文 | 夏汀 来源 | 智能相对论&#xff08;aixdlun&#xff09; 在今年的乌镇世界互联网大会上&#xff0c;搜狗展出了一项黑科技——唇语识别&#xff0c;12月14号搜狗在北京又公开演示了这项技术。作为行业领先的唇语识别系统&#xff0c;搜狗在非特定开放口语测试中&#x…...

wordpress添加中文语言/电商平台发展现状与趋势

摆脱这些坏习惯可以带来意想不到的效果&#xff1a;编写出更优质精简的代码。以下为译文&#xff1a;我们都有过这样的经历&#xff1a;在妈妈不注意的时候偷吃一块饼干&#xff1b;聚餐时过量饮酒&#xff1b;把车停在超时停车的停车位上——我们甚至在死亡边缘疯狂试探。是的…...

自己动手获取网站访客qq号码/自媒体平台排名

目录 课前测3-字符三角形 程序设计 程序分析 课前测3-字符三角形 【问题描述】 我们学习了编程,通过对程序的控制,可以做一些有趣的输出。 比如,这个题目就是给定一个正整数N,请你输出一个由N行的*组成的三角形。 但是——为了图形的美观,我们希望输出的是一个等…...

免费做网站软件/seo最新快速排名

什么是Seata 关于Seata的简介&#xff0c;直接参考官网是最好的&#xff0c;官网的介绍是最详细。地址如下&#xff1a;Seata Docker部署Seata 1.版本参考 链接&#xff1a;Seata和Spring Cloud Alibaba版本对应 2.初始化Seata配置文件 根据项目spring cloud alibaba的版…...

做的网站怎么上传到网上/网站目录结构

plugins 勾上 插件即可...

网站是数据/品牌推广的概念

【踩坑】win10迁移系统到移动硬盘, 换系统盘,无法启动等问题仅迁移用移动硬盘中转迁移并移除原系统盘踩坑心得1. 准备工作要做好2. 不要轻易删除原系统盘的引导分区efi, 除非你必须要更换原来的硬盘3. 新硬盘的格式要先修改, 再迁移4. 要设置好esp分区和重新设置引导续找不到U盘…...