這篇文章主要介紹“CSS面試的高頻考點有哪些”，在日常操作中，相信很多人在CSS面試的高頻考點有哪些問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”CSS面試的高頻考點有哪些”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

創(chuàng)新互聯(lián)主要從事成都做網(wǎng)站、網(wǎng)站制作、網(wǎng)頁設計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務。立足成都服務龍子湖,十年網(wǎng)站建設經(jīng)驗,價格優(yōu)惠、服務專業(yè),歡迎來電咨詢建站服務:13518219792

CSS是層疊樣式表( Cascading Style Sheets )的縮寫，是一種樣式表語言，用于描述以 HTML  之類的標記語言編寫的文檔的布局。它是用于設計Web頁面的三劍客之一，另外兩位浩客是HTML和Javascript。

CSS 的設計目的是使樣式和內(nèi)容分離，包括布局、顏色和字體。這種分離可以提高內(nèi)容的可訪問性，在樣式特征的規(guī)范中提供更多的靈活性和控制，通過在一個單獨的.  .css文件中指定相關的 CSS，使多個 web 頁面能夠共享格式，并減少結(jié)構內(nèi)容中的復雜性和重復。它具有簡單的語法，并使用大量的英文關鍵字來指定各種樣式屬性的名稱。

問題1：什么是 CSS?

CSS(層疊樣式表)是一種樣式語言，對于 HTML 元素來說足夠簡單。它在網(wǎng)頁設計中非常流行，其應用在XHTML中也很常見。

問題2：為什么要開發(fā)CSS?

CSS是在1997年開發(fā)的，作為一種web開發(fā)人員設計他們正在創(chuàng)建的web頁面布局的方法。它的目的是讓開發(fā)者將網(wǎng)站代碼的內(nèi)容和結(jié)構從視覺設計中分離出來。

這種結(jié)構和設計的分離允許HTML執(zhí)行比原來更多的功能。

問題3：CSS的主要版本有哪些?

CSS的不同版本：

• CSS1

• CSS2

• CSS2.1

• CSS3

問題4：CSS樣式的組成部分是什么?

一個樣式規(guī)則由三部分組成：

• 選擇器–選擇器是 HTML 標記，用于選擇要設置樣式的內(nèi)容。它根據(jù)其ID，類和名稱選擇 HTML元素。

• 屬性–屬性是 HTML 標簽的一種屬性。簡而言之，所有 HTML 屬性都轉(zhuǎn)換為 CSS 屬性。

• 值– CSS中的值定義CSS屬性的一組有效值。

問題 5：有多少種方法可以將 CSS 集成為 web 頁面

CSS 可以集成為三種方式：

• 內(nèi)聯(lián)：直接在HTML元素上使用

hello world

• 外部：在工作空間中創(chuàng)建單獨的CSS文件，然后在創(chuàng)建的每個web頁面中鏈接它們

• 內(nèi)部：web 頁面的 head 元素在其中實現(xiàn)了內(nèi)部 CSS。

head>       

問題 6：誰在維護 CSS 規(guī)范?

萬維網(wǎng)協(xié)會維護 CSS規(guī)范。

問題 7：偽元素是什么意思?

偽元素是添加到選擇器的關鍵字，它允許一種樣式，即所選元素的特定部分。CSS用于在HTML標記中應用樣式，它允許在不影響實際文檔的情況下對文檔進行額外標記。它可以用來：

• 為第一個字母、行或元素設置樣式。

• 插入內(nèi)容

語法：

Selector: :pseudo-element {Property1 :value; Property2 :value;}

問題 8：CSS有什么優(yōu)勢?

CSS的優(yōu)點是：

• 一致性 – CSS有助于構建一致的框架，設計人員可以使用該框架來構建其他站點。因此，網(wǎng)頁設計師的效率也提高了。

• 易于使用 – CSS 是非常容易學習和簡化網(wǎng)站開發(fā)。所有代碼都放在一個頁面上，這意味著對代碼行進行改進或編輯不需要重復修改多個頁面.

• *網(wǎng)站速度 *– 通常，一個網(wǎng)站使用的代碼最多可以達到 2  頁或更多。但是對于CSS，這不是問題。它只需要2-3行代碼，因此，網(wǎng)站數(shù)據(jù)庫保持整潔，消除任何網(wǎng)站加載問題。

• 設備兼容性 – 由于人們使用不同類型的智能設備訪問互聯(lián)網(wǎng)，因此需要響應式web設計。CSS 在這里的作用是使 web  頁面的響應性更好，這樣它們就可以在所有設備中以相同的方式顯示。

• 多瀏覽器支持 – CSS享有多瀏覽器的支持，它與所有主要的互聯(lián)網(wǎng)瀏覽器兼容。

• 重新定位 – CSS允許您定義頁面上 web 元素位置的變化。通過它的實現(xiàn)，開發(fā)人員可以將 HTML  元素放置在他們喜歡的位置，以便與頁面的美學吸引力或其他考慮因素保持一致。

問題9：CSS 漸變是什么?

漸變是指我們在兩幅圖像之間創(chuàng)建中間幀，以獲得第一幅圖像的外觀，然后發(fā)展成第二幅圖像的過程，它主要用于創(chuàng)建動畫。

問題10：什么是 CSS 特異性?

CSS 特定性是一個分數(shù)或等級，它決定了元素必須使用哪種樣式聲明。CSS 中有四類可以授權選擇器的特異性級別：

• 內(nèi)聯(lián)樣式

• ID

• 類，屬性和偽類

• 元素和偽元素

問題12：CSS有什么缺點

CSS的缺點有：

• 版本太多 –  與HTML或Javascript等其他參數(shù)相比，CSS有很多版本-CSS1，CSS2，CSS2.1，CSS3。因此，CSS變得非常混亂，尤其是對于初學者。

• 缺乏安全性 - 由于CSS是基于開放文本的系統(tǒng)，因此它沒有內(nèi)置的安全系統(tǒng)來防止其被覆蓋。通過對其讀/寫操作的訪問，任何人都可以更改 CSS  文件并更改鏈接。

• Fragmentation - 使用 CSS，可能無法在一個瀏覽器上使用另一瀏覽器。因此，在網(wǎng)站上線之前，Web  開發(fā)人員必須通過在多個瀏覽器上運行程序來測試兼容性。

• 復雜性–使用 Microsoft FrontPage 等第三方軟件會使CSS變得復雜。

問題13：什么是 RWD (Responsive Web Design)?

RWD(響應式Web設計)技術用于在每種屏幕尺寸以及移動，平板電腦，臺式機和筆記本電腦等設備上完美顯示設計頁面，讓我們無需為每個設備創(chuàng)建不同的頁面。

問題14：CSS 精靈有什么好處?

CSS精靈的好處有：

• 通過將各種小圖像組合成一個圖像，減少了web頁面的加載時間。

• 減少HTTP請求，從而減少加載時間。

問題 15：什么是 CSS 上下文選擇器?

上下文選擇器，嚴格來講，叫后代組合式選擇器，就是一組以空格分隔的標簽名。用于選擇作為指定祖先元素后代的標簽。只要有標簽在它的層次結(jié)構“上游”存在這么一個祖先，那么就會選中該標簽。無論從該標簽到作為祖先的上下文之間隔著多少層次都沒有關系。

問題 16：什么是漸進增強和平穩(wěn)退化?

漸進增強的概念是指從最基本的可用性出發(fā)，在保證站點頁面在低級瀏覽器中  的可用性和可訪問性的基礎上，逐步增加功能及提高用戶體驗。本質(zhì)上講，我們?nèi)粘５囊恍╅_發(fā)習慣，例如首先使用標記語言編寫頁面，然后通過樣式表來控制頁面  樣式等，都屬于漸進增強的概念;其他更為明顯的行為包括使用HTML5、CSS3等新技術，針對高級瀏覽器為頁面提高用戶體驗的豐富程度。

平穩(wěn)退化的概念是指首先使用最新的技術面向高級瀏覽器構建最強的功能及用戶體驗，然后針對低級瀏覽器的限制，逐步衰減那些無法被支持的功能及體驗;在我們?nèi)粘５拈_  發(fā)中，一個典型的平穩(wěn)退化的例子就是首先針對Chrome編寫頁面代碼，然后修復IE中的異?；蜥槍E去除那些無法被實現(xiàn)的功能特色.

所以， 這兩個概念方法其實早已并存在我們的日常開發(fā)工作中了，只是“漸進增強”與“平穩(wěn)退化”這樣的措辭是近些年才開始被普及。在我們眼下的HTML5與  CSS3實戰(zhàn)用，這兩個概念就尤其重要了，怎樣保證使用不斷變化的新技術來構建在主流瀏覽器下都具有基本可用性的站點，并針對高級瀏覽器進行體驗提升，這  些是我們在開發(fā)過程中需要明確的思路。

問題 17：我們?nèi)绾卧诰W(wǎng)頁上添加圖標?

我們可以使用諸如font-awesome或者阿里的  iconfont之類的圖標庫將圖標添加到HTML網(wǎng)頁。我們必須將給定圖標類的名稱添加到任何內(nèi)聯(lián)HTML元素中。(或)。圖標庫中的圖標是可縮放的矢量，可以使用CSS進行自定義。

問題 18：哪個屬性指定邊框的寬度?

border-width指定邊框的寬度。

問題 19：如何區(qū)分物理標簽和邏輯標簽?

物理標簽被稱為表示標記，而邏輯標簽對于外觀是無用的。物理標簽是較新的版本，而邏輯標簽是舊的并且專注于內(nèi)容。

如題，我們的標簽元素寫上后，瀏覽器就會渲染出結(jié)果，但不僅僅是這么簡單

//物理元素 我想用b標簽加粗  //邏輯元素 我想用strong標簽加粗  //兩段文字都加粗了，而且視覺效果完全一樣

確實，文字加粗了，兩者都達到了我們想要的目的，但是我們忽略了一個問題，既然b標簽可以加粗，那么strong這個標簽同樣是加粗，存在的  意義又是什么呢?既然W3C定義了兩個，它們之間的不同點是什么呢?它們之間的相同點又是什么呢?

(1) 物理元素

物理元素，又叫實體標簽，它所做的是一種物理行為，比如上面我把一段文字用b標簽加粗了，它所傳達的給瀏覽器，告訴瀏覽器  我要加粗這段文字，從單詞Bold中也可以看出來，英文中僅僅是加粗的意思，并沒有其他作用。總結(jié)來說就是一句話：物理元素就是告訴瀏覽器該怎么顯示出來。

(2) 邏輯元素

邏輯元素，從英文字面上Strong就可以看出它是強調(diào)的意思，所以我們用這個邏輯元素(如上strong)來向瀏覽器傳達  一個強調(diào)某段文字重要性的消息，說明此文字較為重要，也有利于搜索引擎收錄。

Web標準主張XHTML不涉及具體的表現(xiàn)形式，“強調(diào)”可以用加粗來強調(diào)，也可以用別的方式強調(diào)，也可以通過css來改變strong的具體表現(xiàn)  ，還有就是并不是有了strong邏輯標簽，就不用b標簽來表示字體加粗了，b標簽和strong標簽默認情況下強調(diào)的效果一致，strong完全可以定義成別的樣式，用來強調(diào)  效果，但是最好符合W3C標準，它更提倡內(nèi)容與樣式分離，所以單純?yōu)榱诉_到加粗而使用b標簽不建議這樣做，  從XHTML文檔有意義性及用戶體驗角度來說，strong邏輯標簽更加合適，而SEO方面，則針對優(yōu)化情況而定。

問題 20：如何在CSS中定義一個偽類?它們是用來干什么的

CSS偽類是用來添加一些選擇器的特殊效果。偽類的語法

selector:pseudo-class{property:value;}

問題 21：CSS和SCSS有什么區(qū)別?

CSS 和 SCSS 之間的區(qū)別如下：

• CSS是一種用于設計web頁面的樣式語言，而SCSS用于為瀏覽器組合CSS樣式表。

• SCSS 提供了一些變量，可以使用這些變量來縮短代碼，這是與 CSS 相比的一大優(yōu)勢。

問題 22：嵌入式樣式表的優(yōu)缺點是什么?

嵌入式樣式表的優(yōu)點：

• 可以在一個文檔中創(chuàng)建多種標簽類型。

• 在復雜情況下，可以使用選擇器和分組方法來應用樣式。

• 無需額外下載。

嵌入式樣式表的缺點：

• 無法控制多個文檔。

問題 23：列出使用的各種媒體類型

不同的介質(zhì)不區(qū)分大小寫，因此它們具有不同的屬性。他們是：

• aural - 用于語音和音頻合成器

• print - 用于打印機

• projection - 用于方案展示，比如幻燈片

• handheld - 用于小的手持的設備

• screen - 用于電腦顯示器

問題 24：font 的屬性有哪些?

• Font-style

• Font-variant

• Font-weight

• Font-size/line-weight

• Font-family

問題 25：“規(guī)則集”是什么意思?

該指令告訴瀏覽器如何在HTML頁面上渲染特定元素。它由一個選擇器和一個遵循規(guī)則集的聲明塊組成。選擇器可以附加到其他選擇器，以通過規(guī)則集進行標識。

問題 26：什么是 CSS 框架?

CSS  框架是一個庫，它允許使用CSS語言進行更輕松，更符合標準的Web設計。這些框架中的大多數(shù)至少包含一個網(wǎng)格以及更多功能和其他基于Javascript的功能。一些著名的CSS框架有：ACSS，Bulma，YAML，F(xiàn)oundation等。

到此，關于“CSS面試的高頻考點有哪些”的學習就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續(xù)學習更多相關知識，請繼續(xù)關注創(chuàng)新互聯(lián)網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>
本文題目：CSS面試的高頻考點有哪些
轉(zhuǎn)載注明：http://weahome.cn/article/pjpgph.html