less 笔记

news2024/12/27 11:39:28

1 margin-left 之后有 margin: 0 导致margin-left 无效 --> 不能重复定义

.btn-group {
  margin-left: calc(100% - 350px);
  display: inline-block;
  margin: 0; // 重复定义 导致上面 没有效果
  padding: 0;
}

2 一定要F12检查元素 看各个div的宽度是否太长 导致靠左靠右 计算不对

3 margin-left 是指距离左边框 或者左边的div距离,左边有div就是距离div的距离

4 @media (max-width: 1050px) 是小屏幕最大值1050px

@media (max-width: 1050px) 使用@media就不能用绝对位置absolute

5 设置div水平居中

margin-left: calc((100% - 320px - 80px) / 2);
  // 1 父元素不能设置这个 justify-content: center; 
  // 2 总宽度的1/2 - 自生宽度1/2 - aside宽度1/2

6 两个div水平定位margin-left: calc() 计算位置

 

第一个div 居中就是, 
1 父元素不能设置这个 justify-content: center; 

父元素的总宽度的1/2 - 自生宽度1/2 - aside宽度1/2

第二个div 靠右
就是 依靠 第一个元素的最左边位置 计算:
50% - 第一个元素的宽度 / 2  - 自身宽度 = 剩余的可用宽度 
--> 就是要靠左边的距离

7 calc((100% - 400px - 80px) / 2); 中 - 号 前后要有空格!!

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

5.1 Python高阶特性之递归函数

基本概念: 如果一个函数在内部调用自身本身,这个函数就是递归函数使用递归函数的优点是逻辑简单清晰,缺点是递归过深会导致栈溢出。【注意】 递归函数定义时, 一定存在某个条件能结束执行, 递归最重要的就是需要避免死…

免费使用Elasticsearch官网15天

注册登录 点击创建索引时候会给你展示一个密钥。这个密钥就是你的用户密码 如下图 你的服务地址大致样式如下 https://huihai.es.us-central1.gcp.cloud.es.io 这里需要你输入用户密码,上面图4(图中),下载时候的用户密码 登录完成 这样就能…

【Python爬虫】CSDN热榜文章热门词汇分析

📚 前言 在信息时代,我们经常需要从大量的文章中获取有用的信息。本文将介绍如何使用Python进行数据处理,获取热榜文章的标题和标签,并使用jieba库进行数据分析。通过本文的学习,你将掌握获取和分析热榜文章数据的技巧…

[英语单词] components;

*[kәm’pәunәnt] n. 元件, 组件, 成分 a. 组成的, 构成的 【计】 组件 【化】 组分 【医】 成分; 组元(神经元组) 有很多地方使用这个单词,在组成整体时,作为单位一内的占有比率。那为什么不用portion? 这样每一个组成部分都是一个compon…

使用 YOLOv8 和 Streamlit 构建实时对象检测和跟踪应用程序:第 1 部分-介绍和设置

示例:图像上的对象检测 介绍 实时视频中的目标检测和跟踪是计算机视觉的一个重要领域,在监控、汽车和机器人等各个领域都有广泛的应用。 由于需要能够识别和跟踪对象、确定其位置并对它们进行实时分类的自动化系统,对视频帧中的实时对象检测和跟踪的需求日益增加。 在这…

疫情防控【并查集,离线查询,依次删除节点逆向转化为逐渐添上节点】

5 5 3 1 2 1 3 1 5 2 5 3 4 4 3 1 3 1 4 2 3 5 3 3 4 2 3 3 5 1 3 2 3 2 5 3 4输出样例: 1 2 3#include <bits/stdc.h> using namespace std; const int M1e35; const int N2e55; vector<int> e[N]; #define pii pair<int,int> vector<pii> query[M];…

day26 求一段连续子数组之和的最大值

题目描述 方法一&#xff1a;超出时间限制 思路&#xff1a;选一个起点&#xff0c;选一个终点&#xff0c;计算起点到终点的和&#xff1b;求max&#xff1b; 起点几种可能&#xff1a;0 到 size -1; 终点&#xff1a; 起点 到 size -1&#xff1b; int maxSubArray(int* nu…

【网站 全选和单选】js 实现-点击全选按钮时,所有的按钮都会被选中或取消选中。

要实现的效果如图&#xff1a; 代码实现&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport…

【基本绘图注释函数】——MatLab画图

目录索引 title&#xff1a;ylable&#xff1a;legend&#xff1a; title&#xff1a; 在绘图中添加标签。此类函数的输入是一个字符串。MATLAB 中的字符串是用双引号 (") 引起来的。 上面一部分画图代码这里省略 title("Sample Mass")ylable&#xff1a; 为y轴…

BUUCTF-EasyLogin

这是一道 Node.js 语言的题目&#xff0c;在此记录我在做这道题的思考过程。 这道题考的是 CVE-2022-23540. 简单测试 进入题目环境&#xff1a; 一个登录页面&#xff0c;由题目的名称 EasyLogin&#xff0c;我猜测这道题是身份认证缺陷的问题。不过&#xff0c;还是下意识测…

用主流编程语言解小学题

最近在网上刷到一个视频&#xff0c;内容是奶奶有60 元钱&#xff0c;去超市买了10元水果&#xff0c;收营员应该找奶奶多少钱?我一开始反应就是50元&#xff0c;后来想了想题干里没有说明这60元是怎么构成的&#xff0c;有可能是一张50元和一张10元&#xff0c;或者是3张20元…

day36-JSON+Servlet

0目录 JSONServlet 1.JSONServlet 1.1 创建工程/导入依赖/创建包/BaseDao...... 依赖&#xff1a;javax.servlet、jstl、mysql、taglibs、fastjson <dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifactId> <…

sqli-labs 1-5 (手注和sqlmap)

sql注入 就是指web运用程序对用户输入数据的合法性没有判断&#xff0c;前端传入后端的参数是攻击者可控的&#xff0c;并且参数代入数据库查询&#xff0c;攻击者可以构造不同的SQL语句来实现对数据库的任意操作。 当然&#xff0c;SQL注入按照不同的分类方法可以分为很多种&a…

高等数学❤️第一章~第二节~极限❤️极限的概念与性质~函数极限(自变量趋于有限值时的极限)详解

【精讲】高等数学中函数极限&#xff1a;自变量趋于有限值时的极限 博主&#xff1a;命运之光的主页 专栏&#xff1a;高等数学 目录 【精讲】高等数学中函数极限&#xff1a;自变量趋于有限值时的极限 导言 二、函数极限自变量趋于有限值的判定方法 三、函数极限自变量趋于…

回溯算法详解(Back Tracking)

本文已收录于专栏 《算法合集》 目录 一、简单释义1、算法概念2、算法目的3、算法思想 二、核心思想三、图形展示四、算法实现1、实现思路2、代码实现TreeNode 类将数组处理成二叉树结构并且返回根节点进行搜索 五、算法分析1、时间复杂度2、空间复杂度3、算法稳定性 一、简单释…

RestFul风格讲解

以前是localhost:8080/user?methodadd&uid1; RestFul风格是以/接上的 localhost:8080/user/马云/6562 package com.qf.controller; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annot…

freemarker模板在客服域的使用场景及用法介绍

&#x1f34a; Java学习&#xff1a;社区快速通道 &#x1f34a; 深入浅出RocketMQ设计思想&#xff1a;深入浅出RocketMQ设计思想 &#x1f34a; 绝对不一样的职场干货&#xff1a;大厂最佳实践经验指南 &#x1f4c6; 最近更新&#xff1a;2023年7月15日 &#x1f34a; 点…

从零搭建秒杀服务

1. 前言 目的&#xff1a;该项目只用于技术交流&#xff0c;不用于过多商业用途。 适用&#xff1a;可用于简历亮点、毕业答辩等。 2. 项目成果 2.1 秒杀主页 包含5个功能点&#xff1a; ①、Product Name&#xff1a;秒杀商品名称 ②、Product Image&#xff1a;秒杀商…

Multiframe-to-Multiframe Network for Video Denoising

Multiframe-to-Multiframe Network for Video Denoising 摘要 现存方法&#xff1a;多相邻帧恢复一个干净帧&#xff0c;效果好但是由于按顺序去噪考虑可能造成视频闪烁&#xff1b; 本文&#xff1a;提出一个多帧对多帧的去噪模型&#xff0c;从连续噪声帧中恢复多个干净帧…

【通览一百个大模型】GLM(THU)

【通览一百个大模型】GLM&#xff08;THU&#xff09; 作者&#xff1a;王嘉宁&#xff0c;本文章内容为原创&#xff0c;仓库链接&#xff1a;https://github.com/wjn1996/LLMs-NLP-Algo 订阅专栏【大模型&NLP&算法】可获得博主多年积累的全部NLP、大模型和算法干货资…