前端開發面試題總結-CSS篇

文章目錄

  • CSS面試高頻問答
    • 1、CSS選擇器的優先級
    • 2、CSS3新特性
    • 3、如何垂直水平居中盒子
    • 4、什么是重繪和重排
    • 5、px/em/rem/vw有什么區別
    • 6、rem布局的原理
    • 7、如何設置比12px還要小的字體
    • 8、CSS中隱藏元素的方式有哪些

CSS面試高頻問答

1、CSS選擇器的優先級

在這里插入圖片描述

2、CSS3新特性

在這里插入圖片描述

3、如何垂直水平居中盒子

在這里插入圖片描述

4、什么是重繪和重排

在這里插入圖片描述

5、px/em/rem/vw有什么區別

在這里插入圖片描述

6、rem布局的原理

在這里插入圖片描述

7、如何設置比12px還要小的字體

1.為什么
谷歌默認可設置最小字體12px,特殊場景需要設置更小字體
2.方式一
CSS3的縮放

p {
font-size:12px;
transform:scale(0.8);
}
注意:行內元素沒有效果

3.方式二
zoom屬性

p {
font-size:12px;
zoom:0.5;

8、CSS中隱藏元素的方式有哪些

在這里插入圖片描述## 9、CSS中如何畫一個三角形
1.三角盒子的寬和高皆設置為零
2.通過設置盒子的邊框屬性值來決定盒子的大小

.box {width: 0;height: 0;border: 10px solid transparent;border-bottom-color: black;}

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/pingmian/84164.shtml
繁體地址,請注明出處:http://hk.pswp.cn/pingmian/84164.shtml
英文地址,請注明出處:http://en.pswp.cn/pingmian/84164.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Python如何給視頻添加音頻和字幕

在Python中,給視頻添加音頻和字幕可以使用電影文件處理庫MoviePy和字幕處理庫Subtitles。下面將詳細介紹如何使用這些庫來實現視頻的音頻和字幕添加,包括必要的代碼示例和詳細解釋。 環境準備 在開始之前,需要安裝以下Python庫:…

解決ubuntu20.04無法喚醒的問題的一種方法

解決ubuntu20.04無法喚醒的問題的一種方法 我更改了三個個地方,目前不清楚是哪個地方起的作用,也可能都起作用了 修改的第一個地方 步驟 1: 獲取 Swap 分區的 UUID 首先,你需要知道你的 swap 分區的 UUID。你可以使用以下命令來查找它&am…

【大廠機試題解法筆記】矩陣匹配

題目 從一個 N * M(N ≤ M)的矩陣中選出 N 個數,任意兩個數字不能在同一行或同一列,求選出來的 N 個數中第 K 大的數字的最小值是多少。 輸入描述 輸入矩陣要求:1 ≤ K ≤ N ≤ M ≤ 150 輸入格式 N M K N*M矩陣 輸…

Kubernetes 網絡模型深度解析:Pod IP 與 Service 的負載均衡機制,Service到底是什么?

Pod IP 的本質與特性 Pod IP 的定位 純端點地址:Pod IP 是分配給 Pod 網絡命名空間的真實 IP 地址(如 10.244.1.2)無特殊名稱:在 Kubernetes 中,它通常被稱為 “Pod IP” 或 “容器 IP”生命周期:與 Pod …

使用osqp求解簡單二次規劃問題

文章目錄 一、問題描述二、數學推導1. 目標函數處理2. 約束條件處理 三、代碼編寫 一、問題描述 已知: m i n ( x 1 ? 1 ) 2 ( x 2 ? 2 ) 2 s . t . 0 ? x 1 ? 1.5 , 1 ? x 2 ? 2.5 min(x_1-1)^2(x_2-2)^2 \qquad s.t. \ \ 0 \leqslant x_1 \leqslant 1.5,…

pe文件結構(TLS)

TLS 什么是TLS? TLS是 Thread Local Storage 的縮寫,線程局部存儲。主要是為了解決多線程中變量同步的問題 如果需要要一個線程內部的各個函數調用都能訪問,但其它線程不能訪問的變量(被稱為static memory local to a thread 線程局部靜態變…

Electron簡介(附電子書學習資料)

一、什么是Electron? Electron 是一個由 GitHub 開發的 開源框架,允許開發者使用 Web技術(HTML、CSS、JavaScript) 構建跨平臺的桌面應用程序(Windows、macOS、Linux)。它將 Chromium瀏覽器內核 和 Node.j…

如何使用DeepSeek幫助自己的工作?(Java開發)

如何使用DeepSeek幫助自己的工作? 作為Java開發者,你可以通過以下方式高效利用DeepSeek提升工作效率(附具體操作示例): 一、日常編碼加速 1. 代碼生成與補全 // 輸入需求描述: "生成SpringBoot分頁…

Uniapp 二維碼生成與解析完整教程

前言 使用Uniapp開發多平臺應用&#xff0c;二維碼生成采用uQRCode插件&#xff0c;非常nice&#x1f601;&#xff01; Coding 原理 使用canvas繪制 生成二維碼數據 繪制到canvas上 使用 <uqrcoderef"uqrcodeRef"canvas-id"qrcode":value"qr…

Vue ⑤-自定義指令 || 插槽

自定義指令 自定義指令&#xff1a;自己定義的指令, 可以封裝一些 dom 操作&#xff0c; 擴展額外功能。 全局注冊 語法&#xff1a; Vue.directive(指令名, {"inserted" (el) {// 可以對 el 標簽&#xff0c;擴展額外功能el.focus()} })局部注冊 語法&#xff…

Java HttpClient實現簡單網絡爬蟲

今天我將使用Java的HttpClient&#xff08;在Java 11及以上版本中內置&#xff09;來編寫一個入門級的網絡爬蟲示例。 這個示例將演示如何發送HTTP GET請求&#xff0c;獲取響應內容&#xff0c;并處理可能出現的異常。 以下是一個基于Java HttpClient&#xff08;Java 11&…

圖表類系列各種樣式PPT模版分享

圖標圖表系列PPT模版&#xff0c;柱狀圖PPT模版&#xff0c;線狀圖PPT模版&#xff0c;折線圖PPT模版&#xff0c;餅狀圖PPT模版&#xff0c;雷達圖PPT模版&#xff0c;樹狀圖PPT模版 圖表類系列各種樣式PPT模版分享&#xff1a;圖表系列PPT模板https://pan.quark.cn/s/20d40aa…

Sonic EVM L1:沉睡的雄獅已蘇醒

Sonic 鏈 , 是 Fantom 基金會升級后的Layer-1區塊鏈&#xff0c;繼承了 Fantom Opera 的高性能特性&#xff0c;并通過全面技術優化成為EVM兼容的高吞吐量公鏈。 官方網站 : https://www.soniclabs.com 一、Sonic 鏈概述 1. 為什么從 Fantom 更名為 Sonic Sonic 鏈是 Fant…

籃球杯軟件賽國賽C/C++ 大學 B 組補題

3.gcd 模擬 map<pair<int,int>,int>m; void solve(){int n;cin>>n;forr(i,1,n){int ux,uy,vx,vy;cin>>ux>>uy>>vx>>vy;int dxvx-ux,dyvy-uy;if(dx!0&&dy!0){int gabs(__gcd(dx,dy));dx/g,dy/g;//dxdy中除去公共部分(gcd) 就…

技術棧RabbitMq的介紹和使用

目錄 1. 什么是消息隊列&#xff1f;2. 消息隊列的優點3. RabbitMQ 消息隊列概述4. RabbitMQ 安裝5. Exchange 四種類型5.1 direct 精準匹配5.2 fanout 廣播5.3 topic 正則匹配 6. RabbitMQ 隊列模式6.1 簡單隊列模式6.2 工作隊列模式6.3 發布/訂閱模式6.4 路由模式6.5 主題模式…

項目部署到Linux上時遇到的錯誤(Redis,MySQL,無法正確連接,地址占用問題)

Redis無法正確連接 在運行jar包時出現了這樣的錯誤 查詢得知問題核心在于Redis連接失敗&#xff0c;具體原因是客戶端發送了密碼認證請求&#xff0c;但Redis服務器未設置密碼 1.為Redis設置密碼&#xff08;匹配客戶端配置&#xff09; 步驟&#xff1a; 1&#xff09;.修…

Linux邊緣智能:物聯網的終極進化

Linux邊緣智能&#xff1a;物聯網的終極進化 從數據中心到萬物終端的智能革命 引言&#xff1a;邊緣計算的范式轉變 隨著物聯網設備的爆炸式增長&#xff0c;傳統的云計算架構已無法滿足實時性、隱私保護和帶寬效率的需求。邊緣智能應運而生&#xff0c;將計算能力從云端下沉到…

Linux Shell 中的 dash 符號 “-”

Shell中的-&#xff1a;小符號的大智慧 在Unix/Linux系統中&#xff0c;-符號是一個約定俗成的特殊標記&#xff0c;它表示命令應該使用標準輸入或標準輸出而非文件。這個看似簡單的短橫線&#xff0c;完美詮釋了Unix"一切皆文件"的設計哲學。 作為標準輸入/輸出的…

JMeter 實現 MQTT 協議壓力測試 !

想象一下&#xff0c;你的智能家居系統連接了上千個設備&#xff0c;傳感器數據通過 MQTT 協議飛速傳輸&#xff0c;但突然服務器崩潰&#xff0c;燈光、空調全失控&#xff01;如何確保你的 MQTT 經紀人能承受高負載&#xff1f;答案是 JMeter&#xff01;通過安裝 MQTT 插件&…

CKA考試知識點分享(6)---PriorityClass

CKA 版本&#xff1a;1.32 第六套題是涉及PriorityClass相關。 注意&#xff1a;本文不是題目&#xff0c;只是為了學習相關知識點做的實驗。僅供參考 實驗目的 創建一套PriorityClass &#xff0c;驗證PriorityClass的運作策略。 1 環境準備 創建2個pc&#xff0c;一個為高…