在牛腩新聞釋出系統的前台開發中，首次接觸到了css+div進行網頁設計的技術。整的來看，這是網頁設計的最基礎的部分，但也是最常用的部分，是以在這方面打好基礎以後，對以後學習JS、JQ等更加有幫助，也更容易上手。
Css的核心内容：标準流、盒子模型、浮動、定位。
标準流：就是标簽的排列順序，代碼裡面的元素的順序與網頁上的實際排列元素是一緻的就是标準流，當使用浮動或其他手段設定元素順序的時候，元素就脫離了标準流。這裡說明兩個名詞：塊級元素和行級元素。
塊級元素：每個塊級元素占據了一行，一行塊級元素後面一般無法添加其他元素，隻有浮動了的可以添加，且塊級元素可以自動換行，一般作為容器出現，可以包含行級元素。最長見的就是div。
行級元素：也叫内聯元素，一般是基于語義級别的元素，隻能容納文本或其他内聯元素。如span就是一個行級元素。
盒子模型：盒子模型是css的核心内容，了解了盒子模型的内容，對其他内容的了解有幫助，畢竟其他三個的排版也是以網頁中的基本元素為操作對象的，而盒子模型所代表的就是網頁中的操作元素。
從這個盒子模型中可以看出，在網頁上面，元素之間是有距離的這個距離叫margin，是從上下左右四個方向的margin，利用margin可以設定各個元素之間的間距和位置，實作我們的排版。
盒子的邊框是border，同樣有上下左右四個邊，可以設定border的顔色、樣式、粗細等屬性，實作我們的目的。
而盒子的内部的content是盒子的核心區塊，這裡放置我們需要展示的主要内容。Content塊與盒子的邊框之間也是有距離的，這叫padding，同樣有上下左右四個邊可以設定content在盒子中的位置，實作我們的排版。
浮動：float屬性定義元素在哪個方向浮動，以往這個屬性總應用于圖像，使文本圍繞在圖像周圍，不過在 CSS 中，任何元素都可以浮動。浮動元素會生成一個塊級框，而不論它本身是何種元素。
如果浮動非替換元素，則要指定一個明确的寬度；否則，它們會盡可能地窄。假如在一行之上隻有極少的空間可供浮動元素，那麼這個元素會跳至下一行，這個過程會持續到某一行擁有足夠的空間為止。
浮動與盒子模型聯合起來，就可以實作網頁元素的移動和設計，對一些特殊的排版要求來說，浮動是很有必要的移動手段。
定位：分為相對定位、絕對定位和固定定位。
相對定位：元素相對與自己原來的位置進行定位，可以通過設定自己的上下左右的邊界距離來實作相對定位，無論是否進行移動，元素仍然占據原來的空間，可能會覆寫其他框。這裡要說明一點是，網頁都是以左上角為原點，向右為正，向下為正，如下圖：
并不是正常的一個坐标，所有在設定元素的位置的時候要注意一點。
絕對定位：明白了上面的坐标，那麼就了解了絕對定位，是以坐标原點為參照點，進行坐标的設定定位。
還有一種定位是固定定位，大家浏覽網頁的時候可能遇到一些廣告，自己拖動滾動條往下移動的時候，讨厭的廣告跟着滾動條往下移動，結果就是那個廣告還是處在自己原來的地方，這就是固定定位。下圖中的那個紅包就是固定定位，看右邊的滾動條都到下面了，這個紅包還在在原來的位置。
其實浮動float也是一種特殊的定位，這個需要自己的了解了。
通過這些内容的學習，基本掌握了css的使用核心，在今後的工作學習中将發揮重要作用。