資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究CSS重置和規範化的區別是什麼？
開發者希望 HTML 元素在每個瀏覽器中看起來都相同，儘管這取決於每個瀏覽器的功能差異。當瀏覽器渲染 HTML 頁面時，它會應用自己的預設樣式。例如，標題標籤在不同型別的瀏覽器中具有不同的尺寸和字型。這意味著標題可能會有邊距或額外的填充，而您甚至沒有編寫程式碼。
在本教程中，我們將瞭解如何重置和規範化 CSS，以及它們之間的區別。
規範化和重置的區別？
在使用 CSS 時，開發者可能會遇到一些瀏覽器問題，例如標題和大小等可能具有不同的字型。頂部和底部邊距可能不同，預設填充也可能不同。重置和規範化在這種情況下發揮作用，因為它們使所有瀏覽器的預設 CSS 更一致，但關於使用哪種方法的爭論仍在繼續。讓我們詳細瞭解規範化和重置，以便我們可以確定它們之間的區別。
CSS中的重置
為了避免跨瀏覽器差異，在這種技術中，CSS 作者使用 CSS 重置將瀏覽器的所有樣式都設為 null。不同的瀏覽器將擁有自己不同的使用者代理樣式表，以使網站看起來更易讀。例如，您可能在大多數瀏覽器中看到超連結是藍色的，而訪問過的超連結則顯示為紫色。
預設樣式的示例可以是 -
font-weight: bold; font-size: 10px;
所有瀏覽器都會應用此類預設樣式，儘管它取決於瀏覽器將應用哪種樣式。有些可能會應用額外的填充，有些可能會更改邊距，有些甚至可能具有不同的字型樣式。
CSS 重置將強制瀏覽器將所有樣式重置為 null，從而避免由於瀏覽器的預設樣式而出現的差異。
讓我們來看一個將所有元素的粗細和樣式設定為相同的示例。
font-weight: inherit; font-style: inherit; font-family: inherit;
CSS 開發人員發現不一致，因為他們的網站在不同的瀏覽器中看起來不同。重置有助於將預設的瀏覽器樣式設定為 null，這消除了由於不同瀏覽器樣式而可能發生的不一致。
注意 - Internet Explorer 不支援 inherit 屬性，因此繼承的值不會應用，並且 Internet Explorer 上的使用者介面會受到影響。在使用 Internet Explorer 時，重置將幫助我們解決此問題。
示例
讓我們來看一個如何重置預設瀏覽器樣式的示例。
<!DOCTYPE html> <html lang="en"> <head> <title>Example of resetting!!</title> </head> <body> <h1>Hi welcome to another tutorial</h1> <h3>How is your day going?</h3> <h2>We Are learning how to Reset CSS</h2> <h4>It will reset the default CSS by the browser</h4> </body> </html>
我們匯入的連結將重置瀏覽器的預設樣式。重置樣式在其他樣式之前載入，這會導致瀏覽器預設樣式的移除。
由於我們在程式碼中使用了重置，因此以上輸出在每個瀏覽器中看起來都相同。使用重置後，輸出的差異將最小。
CSS中的規範化
為了提高跨瀏覽器相容性，我們對 HTML 元素使用規範化，並替換 HTML 中的重置。規範化的目的是保留瀏覽器保留的有用預設值，而不是全部刪除它們。讓我們看看規範化的用法。
它標準化了 HTML 中許多元素的樣式。
修復了常見瀏覽器的錯誤。
透過改進可用性的文件簡要說明了程式碼。
示例
以下是一個理解規範化概念的示例。在這裡，我們匯入了 normalize，它不會重置瀏覽器的樣式，但它將在所有瀏覽器中顯示相同的輸出，沒有任何差異。
<!DOCTYPE html> <html lang="en"> <head> <title>Example of normalizing CSS</title> <link rel="stylesheet" href= "https://necolas.github.io/normalize.css/7.0.0/normalize.css"> </head> <body> <h1>Hi welcome to another tutorial</h1> <h1>How is your day going?</h1> <h2>We Are learning how to Reset CSS</h2> <h4>It will reset the default CSS by the browser</h4> </body> </html>
以上是將在所有瀏覽器中看起來相同的輸出。
開發者之間正在就選擇哪一個以及哪一個更適合流暢流程進行持續討論。
規範化保留了有用的預設樣式並刪除了那些無用的樣式，而重置則刪除了瀏覽器的所有樣式。在重置中，我們將不得不重新宣告所有樣式才能重置瀏覽器，而規範化將保留所需的樣式並僅刪除不需要的樣式。規範化易於使用，是一種現代技術。
結論
規範化和重置之間沒有太大區別，因為兩者的目的相同，都是為了保留網站的 UI 並使其與所有瀏覽器相容，以便網站在每個瀏覽器中看起來都相同。它們都採用了不同的方法，具體取決於使用者的偏好。
3K+ 次瀏覽
