想起來最近好久沒有更新部落格了，就把這個任務放上吧~
一。兩欄布局。
他這麼說這是全固定的意思？反正我是在左邊設定的23%的寬，右邊77%的寬，float+min-width的布局，算是布局還ok吧，放很大就很難看了。縮小出滾動條。但是這樣就不行了。這是某團隊的提交:
當我一縮小瀏覽器。就亂了，顯然右邊欄的min-width沒設。布局亂了。
這次布局主要是這個問題，我當時也被這個問題所困擾：
這是咋了。。header是設定的width 100%；但是下面的內容超出100%了。100%怎麼會被超過呢？？其實這個100%是相對于父元素的，追究到根，100%也就是瀏覽器的寬，如果沒設定的話。我瀏覽器寬1349px；然而下面的內容大於了這個值，下面的內容超過一屏，出來滾動條，然而上面的100%還是1349px。這就是上面這個例子的問題。
咋辦呢。
一種方法，把header放到內容裡，顯然這裡不可能。第二種，display：fiexd。然後也沒有這種需求。那咋辦。改布局唄。。。
先看這種方法咋布局的，左邊float，右邊margin-left左邊的寬。這是最簡單的左固定右自適應。然而的div是適應了。裡面的內容沒寫適應。。超出div了。解決的方法就是這個div設定min-width，不能讓他很小了。然後裡面所有的內容都得寫自適應，這樣你外層div變了，裡層才能適應，而不是超出div。
二、自定義下拉框
這是我作品的截圖：
這裡border padding，形成外管，那個下拉框的箭頭用了背景。。checkbox的基本相同。
三、hover中的border
這裡每次hover加乙個border咋辦。直接加boder？不行，這樣試試你就知道內容會」一動一動「的。這是怎麼了。
多加了這幾px的border對於下面的10：00am來說就得移位。因為10：00am是margin-top定位的，每次加border都會下移。
解決方法有兩個，乙個是hover之前給他乙個透明的border。這樣hover就是改了border的顏色。所以不會移動。
二呢，是改變定位。讓內容不在margint-top，position：absolute。對於這種定位，你border愛變不變，反正跟我沒關係。。
四、table布局的空隙
table布局，一不注意就直接寫完了。。然後效果是這樣的：
能看到。如果相鄰的td元素都有border這個border就重了。怎麼給他加空隙呢？我試了td加padding，tr加padding，td加margin，tr加margin。然而都不起作用。但是width可以起作用。這樣也不行阿。
width也不能讓他有空隙阿。
這就要上這兩個東西了border-collapse: separate;和border-spacing這是啥。table元素用的屬性，css2就支援了，只是我們不怎麼用。
border-collapse 屬性設定**的邊框是否被合併為乙個單一的邊框，還是象在標準的 html 中那樣分開顯示。
border-spacing 屬性設定相鄰單元格的邊框間的距離（僅用於「邊框分離」模式）。
已經完美的分割開~
五、div滾動條
不知道是不是psd設計圖上面的東西，好多人給了div的滾動條，如下效果：
我作品裡沒有做這個，我就提一下，用到屬性是overflow-y: auto;當然你得給這個div設定乙個固定寬。要例子，在我fancy**的socket.io的聊天室裡，有這樣乙個例子，聊天內容多了以後就有滾動條了。不能一直拉長網頁是吧~
六、css的tab切換
這是要求之一。tab切換呢，我沒做。就大體說一下吧。其實css的tab切換怎麼辦呢，就是tab的顯示和隱藏的問題。但是css沒有點選事件，怎麼觸發顯示和隱藏呢（當然hover觸發就簡單多了）。這裡css有偽類的選擇：
可以用到：focus，：checked等等。把標籤當作input，每次點選就是乙個focus，然後觸發關係選擇，選擇到下面相應的tab控制他的隱藏和顯示。：checked也是同樣的道理。
all over！
百度前端學院實踐記錄
value innnerhtml value是input框的輸入值 innerhtml是dom元素裡面的所有dom結構 keyvalue 13 為回車按鍵 js getfullyear 從data資料中提取年份 ceil 最大整數 floor最小整數 floor 是向負無窮大捨入，floor 10....
百度前端學院任務筆記（一）
1.心得 看完 head first html 與 css 就開始任務。結合任務二著手寫了個簡單的網頁簡歷。一開始認為應該會很easy，沒想到還真不怎麼順利。對元素的定位，字元間距，段落間距的掌握實在糟透了。2.知識點 1 垂直居中 給定元素寬度 可用 具體畫素大小 min width max wi...
百度前端學院學習心得
零基礎html編碼 零基礎html及css編碼 一 三欄式布局 定位和居中問題 待更新 前言 本文隨著我的學習進度在不斷更新維護中 建議使用來代替以實現加粗 可不僅限於加粗字型實現 強調 功能，且在殘障人士使用 閱讀 功能時會重讀。在表單中，建議使用來代替以實現表單提交 submit 支援鍵盤的 e...