仔细学习CSS（一）
推薦編輯器：Notepad (under Windows), TextEdit (on the Mac) or KEdit (under KDE)；
Style Master, Dreamweaver or GoLive
For HTML and CSS, we want simple, plain text files.
?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">DOCTYPE means DOCument TYPE
Between <head> and </head> there is room for various kinds of information that is not shown on screen.
<body>里的就是用來顯示的了~
'2em' means 2 times the size of the current font.
什么是CSS及使用的好處：
cascading Style Sheet：層疊樣式表
控制網頁樣式、能將樣式信息與網頁內容分離的、一種標記性語言。
不需要編譯，由瀏覽器執行。為瀏覽器解釋型語言。
作用于：頁面布局、字體、顏色、背景、特效等。
?
相關組織和歷史：
1994提出、1996年瀏覽器支持、W3C（world wide web consortium）的CSS組。
1996、CSS1；
1998、CSS2；目前是CSS2.1；
CSS3 已經開始應用了~
?
可用于多種設備：手機、電視、打印機、幻燈片等。
?
比傳統HTML的優勢（內容老啦，可忽視）：控制、排版（對應：html的標記）；
提高網頁瀏覽速度：table全加載完顯示？css加載點顯示點？
可維護性、易維護性、SEO等。
?
CSS基本語法：
a{font-size:12px;font-family:"Microsoft Yahei";display:inline-block;}
.last{}/*類選擇符*/
#last{} /*ID選擇符，局限性很大。我個人不喜歡在html結構中使用id。*/
H1, H2, H3 { font-style: bold }/*合并多個selector*/
?
CSS1 定義了50種。 CSS2 在CSS1的基礎上增加了70種，定義了大概120種屬性。
?
HTML里使用CSS的方式，一般四種：
1. 直接寫在標簽里。
<span style="display:block;height:20px;">我不喜歡這樣寫。不建議。</span>
2. 在header頭里加一段css代碼。
<style type="text/css">/*MIME類型，瀏覽器不支持CSS，則會過濾掉。一般不建議。*/
li{list-style-type:none;}
</style>
3. 在header頭引入一個css文件。一般都用這種方式。
<link rel="stylesheet" type="text/css" href="./t1.css">
4. @import 引入。
?
瀏覽器和CSS：
兼容性問題；
是否支持CSS。<style type="text/css"></style>（現在）| <!--注釋-->（過去）
<style type="text/css"></style> 告知瀏覽器引入文件的類型，支持也讀文件，不支持忽視之。
?
樹結構與繼承:
子節點通用樣式可以放在父節點寫，（代碼重構）樣式預設；
也增加了可讀性。（書寫規范）
重寫：
能夠重寫是因為：更具有指向性。更具體。
與順序無關！？
不是所有的屬性都可繼承！
比方說：background...
你在body上寫個background，再看它的子節點，你會發現。。
why？
There are two reasons: first, transparent backgrounds are faster to display (there is nothing to display!) than other -backgrounds.
元素背景默認為 transparent。
Second, since background images are aligned relative to the element they belong to, you would otherwise not always end up with a smooth background surface.
Tips：如果background 屬性存在時，記得增設一個 color 值。確保文字和背景不一致~？
?
問題：需要研究下CSS的繼承性~對于每個屬性的繼承性~
轉載于:https://www.cnblogs.com/hanyuxinting/p/4092722.html
總結
以上是生活随笔為你收集整理的仔细学习CSS（一）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： WPF DataGrid
- 下一篇： 华为云modelarts平台SDK的调用