CSS面试题|[2024-12-24]
1.说一下CSS的盒模型
在HTML页面中的所有元素都可以看成是一个盒子
盒子的组成:内容content、内边距padding、边框border、外边距margin
盒模型的类型:
标准盒模型
margin + border + padding + content
IE盒模型
margin + content(包括border + padding)
控制盒模型的模式:box-sizing:content-box(默认值,标准盒模型)、border-box(IE盒模型)
2.CSS选择器的优先级
CSS的特性:继承性、层叠性、优先级
优先级:写CSS样式的时候,会给同一个元素添加多个样式,此时谁的权重高就显示谁的样式
选择器有:标签、类/伪类/属性、全局选择器、行类样式、id、!important
优先级分别为:
!important > 行类样式 > id > 类/伪类/属性 > 标签 > 全局选择器
3.隐藏元素的方法有哪些
display:none;
元素在页面上消失。不占据空间
opacity:0;
设置了元素的透明度为0,元素不可见,占据空间位置
visibility:hidden;
让元素消失,占据空间位置,一种不可见的状态
position:absolute;
clip-path
4.px和rem的区别是什么
px是像素,显示器上给我们呈现画面的像素,每个像素的大小是一样的,绝对单位长度
rem是相对单位,相对于html根节点的font-size的值,直接给html节点的font-size:62.5%
1rem = 10px (16px * 62.5% = 10px)
5.重绘重排有什么区别
重绘:当元素的外观(比如颜色、背景色等不影响布局的样式)发生改变时,浏览器对该元素进行重新绘制的过程。
重排:也称回流,当文档的布局(比如元素的大小、位置、隐藏或显示等影响布局的操作)发生改变时,浏览器需要重新计算元素的几何属性(位置、大小等),并重新构建渲染树的过程。
关系:
重排必然会导致重绘,因为当布局发生改变后,元素的外观也需要重新绘制。但是重绘不一定会导致重排,只有当元素的外观改变不影响布局时,才只会触发重绘。
区别:
1.触发条件:重绘主要是改变元素外观的样式属性触发,而重排主要由改变元素布局的操作触发。
2.性能开销:重排的性能开销远远大于重绘,因为重排设计到复杂的布局计算和渲染树重建。
3.对文档的影响范围:重排会影响整个文档的布局计算,可能会导致多个元素的位置和大小改变;而重绘通常只影响单个元素或少数元素的外观。
6.让一个元素水平垂直居中的方式有哪些
1.定位+margin
2.定位+transform
3.flex布局
4.grid布局
5.table布局
7.CSS的哪些属性可以继承
CSS的三大特性:继承、层叠、优先级
子元素可以继承父类元素的样式
1.字体的一些属性:font
2.文本的一些属性:line-height
3.元素的可见性:visibility:hidden
4.表格布局的属性:border-spacing
5.列表的属性:list-style
6.页面样式属性:page
7.声音的样式属性
8.有没有用过预处理器
预处理语言增加了变量、函数、混入等强大的功能
sass、less
相关文章:
CSS面试题|[2024-12-24]
1.说一下CSS的盒模型 在HTML页面中的所有元素都可以看成是一个盒子 盒子的组成:内容content、内边距padding、边框border、外边距margin 盒模型的类型: 标准盒模型 margin border padding content IE盒模型 margin content(包括border p…...
flask-admin 在modelview 视图中重写on_model_change 与after_model_change
背景: 当我们在使用flask-admin进行WEB开发时应该第一时间想到的是竟可能使用框架推荐的modelView模型,其次才是自定义模型 baseview,因为只有modelview模型下开发才能最大限度的提高效率。 制作: 1、在modelview视图下框架会通过默认视图…...
Excel粘贴复制不完整的原因以及解决方法
在数据处理和分析的过程中,Excel无疑是不可或缺的工具。然而,在使用Excel进行复制粘贴操作时,有时会遇到粘贴不完整的情况,这可能会让人感到困惑和烦恼。本文将深入探讨Excel粘贴复制不完整的原因、提供解决方案,并给出…...
【深度学习环境】NVIDIA Driver、Cuda和Pytorch(centos9机器,要用到显示器)
文章目录 一 、Anaconda install二、 NIVIDIA driver install三、 Cuda install四、Pytorch install 一 、Anaconda install Step 1 Go to the official website: https://www.anaconda.com/download Input your email and submit. Step 2 Select your version, and click i…...
Cocos Creator 3.8.5 正式发布,更小更快更多平台!
在 Cocos Creator 3.8.5 版本中,我们做了新一轮的优化。 在加载速度、代码裁剪、平台增强等多方面做了优化,提升了开发者体验和游戏性能。 希望能够助 Cocos 开发者们的产品更上一层楼。 一、加载速度优化 1、WASM 模块延迟加载 在早期版本中,…...
Python中构建终端应用界面利器——Blessed模块
在现代开发中,命令行应用已经不再仅仅是一个简单的文本输入输出工具。随着需求的复杂化和用户体验的重视,终端界面也逐渐成为一个不可忽视的设计环节。 如果你曾经尝试过开发终端UI,可能对传统的 print() 或者 input() 函数感到不满足&#…...
Android 15 状态栏闹钟图标不显示问题修复
Android 15 状态栏闹钟图标不显示问题修复 问题描述 在 Android 15 系统中,发现即使设置了闹钟,状态栏也不会显示闹钟图标。这个问题影响了用户及时查看闹钟状态的体验。 问题分析 通过查看 SystemUI 的配置文件,发现在 frameworks/base/packages/SystemUI/res/values/conf…...
数据采集背后的效率革命:如何优化你的爬虫性能
在爬虫技术日益发展的今天,性能优化成为提升数据采集效率的关键。面对日益复杂的网页结构和庞大的数据量,高效的爬虫能够显著降低运行时间和资源成本。本文将围绕爬虫性能优化的核心方法展开讨论,并通过实例对比多进程、多线程以及普通爬取的…...
【Compose multiplatform教程06】用IDEA编译Compose Multiplatform常见问题
当我们从Kotlin Multiplatform Wizard | JetBrains 下载ComposeMultiplatform项目时 会遇到无法正常编译/运行的情况,一般网页和桌面是可以正常编译的, 我这里着重解决如下问题 1:Gradle版本不兼容或者Gradle连接超时 2:JDK版本不兼容 3:Gradle依赖库连…...
《计算机组成及汇编语言原理》阅读笔记:p128-p132
《计算机组成及汇编语言原理》学习第 10 天,p128-p132 总结,总计 5 页。 一、技术总结 1.8088 organization and architecture 8088处理器是16位电脑,寄存器是16位,数据总线(data bus)是8位,地址总线是20位。 (1)g…...
使用 OpenCV 在图像中添加文字
在图像处理任务中,我们经常需要将文本添加到图像中。OpenCV 提供了 cv2.putText() 函数,可以很方便地在图像上绘制文本,支持多种字体、颜色、大小和位置等参数。 本文将详细介绍如何使用 OpenCV 在图像中添加文字,介绍 cv2.putTe…...
实现某海外大型车企(T)Cabin Wi-Fi 需求的概述 - 4
大家好,我是Q,邮箱:1042484520qq.com。 今天我们在上几讲的基础上再扩展下 Cabin Wi-Fi 的功能需求,讲讲如何使能 5G TCU Wi-Fi STA Bridge 模式。 参考: 实现某海外大型车企(T)Cabin Wi-Fi 需求…...
Linux系统:内核态与用户态的深层思考
背景: 我们学习Linux的系统调用经常会遇到一个概念:“内核态和用户态的切换”,一般人只会告诉你说这个切换代价很大,具体是什么情况?为什么需要切换?一定需要切换吗?怎么就会触发切换࿱…...
# 光速上手 - JPA 原生 sql DTO 投影
前言 使用 JPA 时,我们一般通过 Entity 进行实体类映射,从数据库中查询出对象。然而,在实际开发中,有时需要自定义查询结果并将其直接映射到 DTO,而不是实体类。这种需求可以通过 JPA 原生 SQL 查询和 DTO 投影 来实现…...
ASP.NET Web应用程序出现Maximum request length exceeded报错
一、问题描述 在ASP.NET的web应用中,导出数据时出现500 - Internal server error.Maximum request length exceeded。 二、原因分析 这个错误通常出现在Web应用程序中,表示客户端发送的HTTP请求的长度超过了服务器配置的最大请求长度限制。这可能是因为…...
HTML——16.相对路径
<!DOCTYPE html> <html><head><meta charset"UTF-8"><title></title></head><body><a href"../../fj1/fj2/c.html" target"_blank">链接到c</a><!--相对路径:-->…...
windows 默认的消息ID有那些---我与大模型对话
前言: 与大模型交流,提问要尽量简短,突出关键词。否则它的回答就可能事是而非。用它总结和查资料还行,用它解决问题路还很远。它非常注重标准格式并机械的执行标准格式,并且事无巨细,不能灵活简要的回答问…...
CSV vs 数据库:爬虫数据存储的最佳选择是什么
介绍 在爬虫技术中,数据存储是一个不可缺少的环节。然而,选择合适的存储方式对数据分析和结果应用都致关重要。CSV和数据库是常用的两种存储方式,但它们各有优缺。这篇文章将分析两者在爬虫数据存储方面的选择值。 微博热搜是当前网络热点话…...
编译原理学习笔记——CH7-Runtime Environments运行时环境
本章重点: 为什么函数调用可以采用栈式存储? 函数调用和返回过程中需要记录哪些信息?如何记录? 主要知识点: 环境、状态、activation (激活) of procedures 、elaboration (确立…...
机器学习DAY7: 特征工程和特征选择(数据预处理)(完)
本文通过特征提取、特征转换、特征选择三个过程介绍数据预处理方法,特征提取将原始数据转换为适合建模的特征,特征转换将数据进行变换以提高算法的准确性,特征选择用来删除无用的特征。 知识点 特征提取特征转换特征选择 本次实验的一些示…...
Chapter03-Authentication vulnerabilities
文章目录 1. 身份验证简介1.1 What is authentication1.2 difference between authentication and authorization1.3 身份验证机制失效的原因1.4 身份验证机制失效的影响 2. 基于登录功能的漏洞2.1 密码爆破2.2 用户名枚举2.3 有缺陷的暴力破解防护2.3.1 如果用户登录尝试失败次…...
调用支付宝接口响应40004 SYSTEM_ERROR问题排查
在对接支付宝API的时候,遇到了一些问题,记录一下排查过程。 Body:{"datadigital_fincloud_generalsaas_face_certify_initialize_response":{"msg":"Business Failed","code":"40004","sub_msg…...
【配置 YOLOX 用于按目录分类的图片数据集】
现在的图标点选越来越多,如何一步解决,采用 YOLOX 目标检测模式则可以轻松解决 要在 YOLOX 中使用按目录分类的图片数据集(每个目录代表一个类别,目录下是该类别的所有图片),你需要进行以下配置步骤&#x…...
IT供电系统绝缘监测及故障定位解决方案
随着新能源的快速发展,光伏电站、储能系统及充电设备已广泛应用于现代能源网络。在光伏领域,IT供电系统凭借其持续供电性好、安全性高等优势成为光伏首选,但在长期运行中,例如老化、潮湿、隐裂、机械损伤等问题会影响光伏板绝缘层…...
ip子接口配置及删除
配置永久生效的子接口,2个IP 都可以登录你这一台服务器。重启不失效。 永久的 [应用] vi /etc/sysconfig/network-scripts/ifcfg-eth0修改文件内内容 TYPE"Ethernet" BOOTPROTO"none" NAME"eth0" DEVICE"eth0" ONBOOT&q…...
【笔记】WSL 中 Rust 安装与测试完整记录
#工作记录 WSL 中 Rust 安装与测试完整记录 1. 运行环境 系统:Ubuntu 24.04 LTS (WSL2)架构:x86_64 (GNU/Linux)Rust 版本:rustc 1.87.0 (2025-05-09)Cargo 版本:cargo 1.87.0 (2025-05-06) 2. 安装 Rust 2.1 使用 Rust 官方安…...
Selenium常用函数介绍
目录 一,元素定位 1.1 cssSeector 1.2 xpath 二,操作测试对象 三,窗口 3.1 案例 3.2 窗口切换 3.3 窗口大小 3.4 屏幕截图 3.5 关闭窗口 四,弹窗 五,等待 六,导航 七,文件上传 …...
C语言中提供的第三方库之哈希表实现
一. 简介 前面一篇文章简单学习了C语言中第三方库(uthash库)提供对哈希表的操作,文章如下: C语言中提供的第三方库uthash常用接口-CSDN博客 本文简单学习一下第三方库 uthash库对哈希表的操作。 二. uthash库哈希表操作示例 u…...
c++第七天 继承与派生2
这一篇文章主要内容是 派生类构造函数与析构函数 在派生类中重写基类成员 以及多继承 第一部分:派生类构造函数与析构函数 当创建一个派生类对象时,基类成员是如何初始化的? 1.当派生类对象创建的时候,基类成员的初始化顺序 …...
提升移动端网页调试效率:WebDebugX 与常见工具组合实践
在日常移动端开发中,网页调试始终是一个高频但又极具挑战的环节。尤其在面对 iOS 与 Android 的混合技术栈、各种设备差异化行为时,开发者迫切需要一套高效、可靠且跨平台的调试方案。过去,我们或多或少使用过 Chrome DevTools、Remote Debug…...
