現代CSS布局：的本質特征
作者：濟南雷鳴科技 文章來源：本站原創 更新時間：2023-11-07
現在是一個激動人心的時刻要創建的CSS布局。經過多年什么感覺的老的瀏覽器相同的老技術，我們終于看到瀏覽器執行3的CSS，HTML 5和其他技術，讓我們為我們的冷卻設計的新工具和技巧。
但是，這種變化都可以壓力也。你如何保持與所有的新技術，并確保您的網頁外觀的瀏覽器和設備越來越多的偉大那里呢？部分本條第1，您將學習5年的成功現代的CSS網站的基本特征。部分本條第2，您將了解的技術和工具，您需要實現這些特性。
我們不會談論的設計趨勢和特點的現代風格，基于CSS的布局。這些樣式總是在變化。相反，我們將側重于廣泛，你需要知道，創造最成功的CSS布局采用最新的技術基本概念。例如，分離內容和表現仍是一個網頁的CSS的基本概念。但是，現代的CSS網頁的其他特征是新的或比以往更加重要。現代基于CSS的網站是：逐步提高，適應不同用戶，模塊化，高效率和印刷上的豐富。
逐步提高，
適應不同用戶，
模塊化，
高效，
印刷上豐富。
漸進增強
漸進增強意味著創造適當的標記內容和先進的造型添加了堅實的網頁（可能腳本）的瀏覽器可以處理它的頁面。它的結果在網頁上是所有的瀏覽器可用，但不要指望在所有瀏覽器相同的。用戶的更新，更先進的瀏覽器能看到更多精彩的視覺效果和不錯的可用性增強。
因此，在設計，研究在不同的瀏覽器不同的想法并不新鮮。的CSS領袖們一直鼓吹多年，是因為字體的可用性和渲染，色調，像素計算和其它技術因素一直瀏覽器和平臺之間的不同。大多數Web設計者避免“像素圓滿”，并接受了他們的設計理念看，在不同的瀏覽器稍有不同。但是，漸進增強，已逐漸風行，在過去幾年里，需要再進一步。正在逐步提高，可能看上去比略有不同的瀏覽器不同的設計，他們看起來非常不同。
例如，tweetCC網站有3數量的CSS屬性，增加吸引力的視覺觸及，如落案背后的陰影，文本和不同顏色的背景，多列“圖像”（不存在，有待實際上是不同的圖像）。這些影響被認為在不同程度不同的瀏覽器，如IE瀏覽器與6歲的前瞻性瀏覽器的“最簡單的。”然而，即使在IE 6中，文本是完全可讀的，設計是非常有用的。
西安網站建設
西安做網站
在CSS 3能夠如Safari瀏覽器（上），網站的tweetCC顯示了一些視覺效果，您不能在IE中看到6（底部）。
這些瀏覽器之間的明顯差異是完全好了，不僅因為這是內置網絡的性質，而是因為漸進增強帶來以下好處：
更強大的網頁
而不是使用優雅退化方法來創建一個全功能的網頁，然后追溯，使之功能較少功能的瀏覽器，您的注意力集中在建立一個堅實的“基礎”的網頁作品隨處可見。
值得高興的用戶
你開始建立網頁，確保基本功能和造型是每個人都一樣。舊的瀏覽器，移動設備和輔助技術的人是開心，因為頁面清潔和可靠的，并且運作良好。最新和最偉大的瀏覽器很高興，因為他們得到了豐富，拋光經驗。
縮短開發時間
您不必花時間試圖讓一切看起來完善，所有的瀏覽器相同的。也不必花太多的時間逆向工程網頁工作的老的瀏覽器后，您已完成了全面的功能和風格的版本（如與優雅降解法的情況下）。
減少維護時間
如果一個新的瀏覽器或新技術時，您可以添加新的功能，你已經擁有的，沒有改變，并可能打破現有的功能。你只有一個頁面或代碼庫版本更新，而不是多個版本（這是與優雅退化的情況下）。
更多樂趣
這只是純粹的娛樂能夠使用您的網頁冷靜和創造性的新技術，而不必等待舊的瀏覽器幾年死了。
漸進增強了解更多：
逐步增強：它是什么，以及如何使用它？
在維基百科中逐步增強
逐步增強：從而為未來的網絡設計方法
能適應不同用戶
現代基于CSS的網頁必須滿足的瀏覽器，設備，屏幕分辨率，字體大小，輔助技術以及其他因素多種多樣，用戶帶來的表。這個概念也并不新鮮，但在日益重要的網絡用戶日益多樣化。例如，幾年前，你幾乎可以指望你有三種屏幕分辨率1的所有用戶。現在，用戶可以查看您的網頁上10英寸上網本，30英寸寬屏顯示器或任何提及之間微小的移動設備，而不是。
西安做網站
在他的文章“使用CSS和jQuery智能列”蘇氏田中描述他的技術能夠適應的布局當前瀏覽器窗口大小而定。
創建web設計，所有方案中所有用戶的工作永遠不會成為可能。但是，更多的用戶，您可以請越好：為他們，為您和您的客戶。成功的CSS布局現在必須更加靈活，適應性比以往的方法，使用戶瀏覽網頁越來越多種多樣。
像這樣的考慮時，創建的CSS布局的因素：
瀏覽器
是設計有吸引力和最新，最流行的瀏覽器使用？但至少是可用舊的瀏覽器？
平臺
是否可以在PC，Mac和Linux電腦的設計工作？
設備
設計是否適應低分辨率的移動設備？它是如何在移動設備上尋找擁有完全的決議（）例如iPhone手機？
屏幕分辨率
是否住在一起的設計，多口（即窗口）寬度？是否有吸引力，易讀，在不同的寬度？如果設計不適應不同的視寬，但對于極窄或寬視口正確的（例如，通過使用最小寬度和最大寬度屬性）？
字體大小
設計是否適應不同的默認字體大小？是否擁有共同的設計時，字體大小是迅速改變？是否有吸引力，易讀，在不同的字體大小？
顏色
設計是否有意義，是可讀的內容在黑色和白色的？難道工作，如果你是色盲或視力欠佳或無法檢測的色彩對比？
JavaScript的存在
是否不JavaScript網頁的工作？
圖像存在
內容是否有意義，是它可讀沒有圖像（無論是背景或前景）？
輔助技術/殘疾
是否在屏幕閱讀器的網頁的工作嗎？是否沒有鼠標的網頁的工作嗎？
這不是一個全面的列表，即使如此，你就不能滿足您的每一個設計的這些變化之一。但你愈是可以解釋的更方便用戶，強大的和成功的將您的網站。
魯公網安備 37010202001976號
