4.3 代碼結構
對于我們的上面的Red示例來說，如果沒有一個好的結構，那么以后可能就是這樣子。
如果沒有一個好的結構
那么以后可能就是這樣子。。。。
雖然我們看到的還是一樣的:
No Style
于是我們就按各種書上的建議重新寫了上面的代碼
如果沒有一個好的結構
那么以后可能就是這樣子。。。。
總算比上面好看也好理解多了，這只是臨時的用法，當文件太大的時候，正式一點的寫法應該如下所示:
如果沒有一個好的結構
那么以后可能就是這樣子。。。。
我們需要
如果沒有一個好的結構
那么以后可能就是這樣子。。。。
然后我們有一個像app.js一樣的style.css放在同目錄下，而他的內容便是
.para{
font-size: 22px;
color:#f00;
text-align: center;
padding-left: 20px;
}
.para2{
font-size:44px;
color:#3ed;
text-indent: 2em;
padding-left: 2em;
}
這代碼和JS的代碼有如此多的相似
var para={
font_size:'22px',
color:'#f00',
text_align:'center',
padding_left:'20px',
}
而22px、20px以及#f00都是數(shù)值，因此：
var para={
font_size:22px,
color:#f00,
text_align:center,
padding_left:20px,
}
目測差距已經(jīng)盡可能的小了，至于這些話題會在以后討論到，如果要讓我們的編譯器更正確的工作，那么我們就需要非常多這樣的符號，除非你樂意去理解:
(dotimes (i 4) (print i))
總的來說我們減少了符號的使用，但是用lisp便帶入了更多的括號，不過這是一種簡潔的表達方式，也許我們可以在其他語言中看到。
\d{2}/[A-Z][a-z][a-z]/\d{4}
上面的代碼，是為了從一堆數(shù)據(jù)中找出“某日/某月/某年”。如果一開始不理解那是正則表達式，就會覺得那個很復雜。
這門語言可能是為設計師而設計的，但是設計師大部分還是不懂編程的，不過相對來說這門語言還是比其他語言簡單易懂一些。
4.4 樣式與目標
如下所示，就是我們的樣式
.para{
font-size: 22px;
color:#f00;
text-align: center;
padding-left: 20px;
}
我們的目標就是
如果沒有一個好的結構
所以樣式和目標在這里牽手了，問題是他們是如何在一起的呢?下面就是CSS與HTML溝通的重點所在了:
4.4.1 選擇器
我們用到的選擇器叫做類選擇器，也就是class，或者說應該稱之為class選擇器更合適。與類選擇器最常一起出現(xiàn)的是ID選擇器，不過這個適用于比較高級的場合，諸如用JS控制DOM的時候就需要用到ID選擇器。而基本的選擇器就是如下面的例子:
p.para{
color:#f0f;
}
將代碼添加到style.css的最下面會發(fā)現(xiàn)“如果沒有一個好的結構”變成了粉紅色，當然我們還會有這樣的寫法
p>.para{
color:#f0f;
}
為了產生上面的特殊的樣式，雖然不好看，但是我們終于理解什么叫層疊樣式了，下面的代碼的重要度比上面高，也因此有更高的優(yōu)先規(guī)則。
而通常我們可以通過一個
p{
text-align:left;
}
這樣的元素選擇器來給予所有的p元素一個左對齊。