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

HTML+CSS練習---空隙產生記錄

1.第一層和第二層之間的間隙:以為導航欄超過高度朝下擠下來了

2.第2層兩個div中的空隙

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><style>@font-face {font-family: 'iconfont';src: url('./font/iconfont.ttf?t=1722477916565') format('truetype');}.iconfont {font-family: "iconfont" !important;font-size: 16px;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}body{padding: 0;margin: 0;background-color: #F5F5F5;font-size: 16px;font-family: Arial, Helvetica, sans-serif;}.clear::after{content: "";display: block;clear: both;}.clear::before{content: "";display: block;clear: both;}.fl{float: left;}.fr{float: right;}.ml7{margin-left: 7px;}.mr7{margin-right: 7px;}.mtb7{margin: 7px 0px;}ul li{list-style: none;}.layer{margin: 0 auto;}.c5{color: #f50;}a{text-decoration: none;}#header1{background-color: #F5F5F5;height: 36px;width: 1280px;}#header1 .selectcorp{width: 500px;font-size: 16px;background-color: white;}#header1 .corpinfo{height: 30px;line-height: 30px;}#header1 .userinfo{margin-right: 30px;height: 30px;line-height: 30px;}#header1 .userinfo .ritem{margin: 0 15px;}#header1 .userinfo .ritem img{width: 18px;height: 18px;}/* 第2塊 logo部分 */#header2{background-color: #e1e9ff;height: 120px;}#header2 .content1{background-color:  #e1e9ff;height: 180px;width: 1280px;background-color: greenyellow;/* overflow: hidden; */}#header2 .content1 .logo{width: 600px;height: 180px;line-height: 180px;background-color: #f50;}#header2 .content1 .logo span{display: inline-block;height: 180px;line-height: 180px;font-size: 50px;font-weight: bold;background-color: #f50;}</style>
</head><body><!-- 第一行登錄信息 --><div id="header1" class="layer clear"><div class="corpinfo mtb7 fl"><span>公司代碼:</span><select class="selectcorp"><option>000XXX--XXXXXXXXX股份有限公司</option></select></div><ul class="userinfo mtb7 fr"><li  class="ritem fr"><span class="iconfont">&#xe798;</span><span>安全退出</span></li><li  class="ritem fr"><span class="iconfont">&#xe7fb;</span><span>修改密碼</span></li><li  class="ritem fr"><span class="iconfont">&#xe60c;</span><span>權限變更</span></li><li class="ritem fr"><span class="iconfont">&#xe608;</span><span>用戶名</span></li>  </ul></div><!-- 第2行系統logo --><div id="header2"><div class="content1 layer clear"><div class="logo fl"><img src=""><span>|XXX系統</span></div><div class="logo fr"> <span style="color: #3378cf;">XXX化&nbsp;&nbsp;&nbsp;XXX化&nbsp;&nbsp;&nbsp;XXX化</span></div>  </div></div><div class="lastone"></div></body>
</html>

相关文章:

HTML+CSS練習---空隙產生記錄

1.第一層和第二層之間的間隙&#xff1a;以為導航欄超過高度朝下擠下來了 2.第2層兩個div中的空隙 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Document</title><style>font-face {f…...

【leetcode】相同的树、另一棵树的子树、翻转二叉树(利用深度优先遍历)

Hi~&#xff01;这里是奋斗的明志&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f331;&#x1f331;个人主页&#xff1a;奋斗的明志 &#x1f331;&#x1f331;所属专栏&#xff1a;数据结构、LeetCode专栏 &#x1f4da;本系…...

Linux系统窗口水印难点分析

给应用程序加水印是保护数据的一种方式&#xff0c;window上可以通过给进程通过注入的方法给进程的窗口创建一个同大小的副窗口&#xff0c;在副窗口上绘制水印内容&#xff0c;同时设置副窗口透明同时透传事件&#xff0c;这样就可以达到在源窗口上显示水印的效果且不影响程序…...

LabVIEW与CANopen实现自动化生产线的设备控制与数据采集

在某工厂的自动化生产线上&#xff0c;多个设备通过CANopen网络进行通信和控制。这些设备包括传感器、执行器和PLC&#xff0c;它们共同负责监测和控制生产过程中的关键参数&#xff0c;如温度、压力、速度等。为了实现对整个生产线的集中监控和管理&#xff0c;工厂决定使用La…...

吃惊!这个Windows双系统方法逆天了|UEFI篇

前言 最近小白在折腾别的系统教程&#xff0c;偶然间发现居然有一个很nice的Windows双系统教程。于是于是&#xff0c;果断尝试了一下&#xff0c;发现真的很可行&#xff01; 这个双系统的办法并不需要使用到WinPE系统&#xff0c;因此并不需要使用到U盘&#xff0c;只需要在…...

【C语言基础】C语言试题复习

1. 执行下面的程序段后&#xff0c;k 的值是_______。 int k1,n325; do { k*n%10;n/10;}while(n); 解析&#xff1a; 给定 n 325 和初始 k 1&#xff0c;代码中的循环将会进行如下操作&#xff1a; 第一次循环:n % 10 得到 5&#xff0c;因此 k * 5&#xff0c;即 k 1 * 5 …...

一拖三无线充底座-带给你极致的便利生活

随着科技的不断进步&#xff0c;无线充电技术已经逐渐渗透到我们日常生活的方方面面&#xff0c;一拖三无线充底座作为其中的佼佼者&#xff0c;以其高效、便捷的特点受到广大用户的青睐。本文将从电磁感应原理、多线圈设计、频率匹配、电能传输、功率分配以及充电管理六个方面…...

探索 Electron:打造深度书籍挖掘机的搜索体验

Electron是一个开源的桌面应用程序开发框架&#xff0c;它允许开发者使用Web技术&#xff08;如 HTML、CSS 和 JavaScript&#xff09;构建跨平台的桌面应用程序&#xff0c;它的出现极大地简化了桌面应用程序的开发流程&#xff0c;让更多的开发者能够利用已有的 Web 开发技能…...

tomato靶场

扫描网址端口 访问一下8888 我们用kali扫描一下目录 访问这个目录 产看iofo.php源码&#xff0c;发现里面有文件包含漏洞 访问/etc/passwd/发现确实有文件包含漏洞 远程连接2211端口 利用报错&#xff0c;向日志文件注入木马&#xff0c;利用文件包含漏洞访问日志文件 http:/…...

【Vue】computed计算对象不生效问题?

问题描述 最近使用vuex来管理全局状态&#xff0c;遇到了computed计算state中数据却不生效的问题。 原因分析&#xff1a; 先看vue官网示例&#xff1a; computed接收的是一个getter函数&#xff0c;但是这个getter函数是懒加载并且有缓存的&#xff0c;当计算属性最终计算…...

算法小白的进阶之路(力扣9~12)

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 非常期待和您一起在这个小…...

DOCKER容器中安装JDK1. 8 详细步骤

1.通过查找JDK8的远程镜像 docker search jdk 2.选择一个远程镜像下载到本地仓库 #拉取镜像 docker pull kdvolder/jdk8#查看镜像 docker images 可以看到REPOSITORY列下面出现了kdvolder/jdk8 3.在docker容器中运行jdk8的镜像 docker run -di --namejdk1.8 kdvolder/jdk…...

计算机毕业设计Python+Tensorflow股票推荐系统 股票预测系统 股票可视化 股票数据分析 量化交易系统 股票爬虫 股票K线图 大数据毕业设计 AI

1、用pycharm打开项目&#xff0c;一定要打开包含manage.py文件所在文件夹 2、配置解释器&#xff1a;建议使用Anaconda(Python 3.8(base))&#xff0c;低于3.8版本的&#xff0c;页面会不兼容 3、安装依赖库&#xff1a;打开pycharm的终端&#xff0c;输入&#xff1a; pip in…...

深度学习常见的卷积和注意力机制文章集锦(持续更新)

卷积 友好链接1 卷积原理&#xff1a;几种常用的卷积&#xff08;标准卷积、深度卷积、组卷积、扩展卷积、反卷积&#xff09; 友好链接2 一文看尽深度学习中的20种卷积&#xff08;附源码整理和论文解读&#xff09; 友好链接3 深度学习中组卷积(Group convolution)、深度卷积…...

如何在立创EDA的PCB电路板导入logo图案

1、首先制作好logo图案&#xff0c;一般为公司logo图标&#xff0c;如下图 2、打开立创EDA的PCB文件&#xff0c;如下图 3、将PCB的图层切换到丝印层&#xff1a; 4、然后选择EDA菜单栏的放置---图片&#xff1a; 5、进入后点击选择图片&#xff0c;将logo图片导入&#xff0c;…...

springboot集成canal

目录 一、打开mysql的binlog1.1 打开 MySQL 配置文件 my.cnf&#xff08;通常位于 /etc/mysql/my.cnf 或 /etc/my.cnf&#xff09;并添加或修改以下设置&#xff1a;1.2 重启mysql服务1.3 验证是否生效 二、 部署canal 服务端&#xff08;docker&#xff09;2.1 下载启动脚本(可…...

leetcode数论(2447. 最大公因数等于 K 的子数组数目)

前言 经过前期的数据结构和算法学习&#xff0c;开始以OD机考题作为练习题&#xff0c;继续加强下熟练程度。 描述 给你一个整数数组 nums 和一个整数 k &#xff0c;请你统计并返回 nums 的子数组中元素的最大公因数等于 k 的子数组数目。 子数组 是数组中一个连续的非空序列…...

实现数组扁平化的几种方式

目标: 实现数组扁平化[1,[2,[3,4,5]]] > [1,2,3,4,5] 我们有几种方法可以实现,分别为: 1、递归 function flatten(list){return list.reduce((tar, cur) > {if(Array.isArray(cur)){tar tar.concat(flatten(cur));} else {tar.push(cur);}return tar;}, []); } flatt…...

3D打印技术正悄然重塑模具工业格局

虽被誉为“工业之母”的模具在批量生产中仍占据核心地位&#xff0c;但3D打印以其“无模”直接成型的特性&#xff0c;在小批量、非标准化及复杂结构件制造领域展现出独特优势&#xff0c;随着技术和装备的不断发展&#xff0c;目前3D打印正逐渐向批量生产渗透&#xff0c;某品…...

深入解析 KMZ 文件的处理与可视化:从数据提取到地图展示项目实战

文章目录 1. KMZ 文件与 KML 文件简介1.1 KMZ 文件1.2 KML 文件 2. Python 环境配置与依赖安装3. 代码实现详解3.1 查找 KMZ 文件3.2 解压 KMZ 文件3.3 解析 KML 文件3.4 可视化 KMZ 数据 4. 项目实战4.1. 数据采集4.2. 项目完整代码 5. 项目运行与结果展示6. 总结与展望 在处理…...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下&#xff1a; struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

镜像里切换为普通用户

如果你登录远程虚拟机默认就是 root 用户&#xff0c;但你不希望用 root 权限运行 ns-3&#xff08;这是对的&#xff0c;ns3 工具会拒绝 root&#xff09;&#xff0c;你可以按以下方法创建一个 非 root 用户账号 并切换到它运行 ns-3。 一次性解决方案&#xff1a;创建非 roo…...

Typeerror: cannot read properties of undefined (reading ‘XXX‘)

最近需要在离线机器上运行软件&#xff0c;所以得把软件用docker打包起来&#xff0c;大部分功能都没问题&#xff0c;出了一个奇怪的事情。同样的代码&#xff0c;在本机上用vscode可以运行起来&#xff0c;但是打包之后在docker里出现了问题。使用的是dialog组件&#xff0c;…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

腾讯云V3签名

想要接入腾讯云的Api&#xff0c;必然先按其文档计算出所要求的签名。 之前也调用过腾讯云的接口&#xff0c;但总是卡在签名这一步&#xff0c;最后放弃选择SDK&#xff0c;这次终于自己代码实现。 可能腾讯云翻新了接口文档&#xff0c;现在阅读起来&#xff0c;清晰了很多&…...

日常一水C

多态 言简意赅&#xff1a;就是一个对象面对同一事件时做出的不同反应 而之前的继承中说过&#xff0c;当子类和父类的函数名相同时&#xff0c;会隐藏父类的同名函数转而调用子类的同名函数&#xff0c;如果要调用父类的同名函数&#xff0c;那么就需要对父类进行引用&#…...

HybridVLA——让单一LLM同时具备扩散和自回归动作预测能力:训练时既扩散也回归,但推理时则扩散

前言 如上一篇文章《dexcap升级版之DexWild》中的前言部分所说&#xff0c;在叠衣服的过程中&#xff0c;我会带着团队对比各种模型、方法、策略&#xff0c;毕竟针对各个场景始终寻找更优的解决方案&#xff0c;是我个人和我司「七月在线」的职责之一 且个人认为&#xff0c…...

Java详解LeetCode 热题 100(26):LeetCode 142. 环形链表 II(Linked List Cycle II)详解

文章目录 1. 题目描述1.1 链表节点定义 2. 理解题目2.1 问题可视化2.2 核心挑战 3. 解法一&#xff1a;HashSet 标记访问法3.1 算法思路3.2 Java代码实现3.3 详细执行过程演示3.4 执行结果示例3.5 复杂度分析3.6 优缺点分析 4. 解法二&#xff1a;Floyd 快慢指针法&#xff08;…...

2.3 物理层设备

在这个视频中&#xff0c;我们要学习工作在物理层的两种网络设备&#xff0c;分别是中继器和集线器。首先来看中继器。在计算机网络中两个节点之间&#xff0c;需要通过物理传输媒体或者说物理传输介质进行连接。像同轴电缆、双绞线就是典型的传输介质&#xff0c;假设A节点要给…...

Java并发编程实战 Day 11:并发设计模式

【Java并发编程实战 Day 11】并发设计模式 开篇 这是"Java并发编程实战"系列的第11天&#xff0c;今天我们聚焦于并发设计模式。并发设计模式是解决多线程环境下常见问题的经典解决方案&#xff0c;它们不仅提供了优雅的设计思路&#xff0c;还能显著提升系统的性能…...