百度前端學院任務筆記（一）

1.心得：看完《head first html 與 css》就開始任務。結合任務二著手寫了個簡單的網頁簡歷。一開始認為應該會很easy，沒想到還真不怎麼順利。對元素的定位，字元間距，段落間距的掌握實在糟透了。

2.知識點：（1）垂直居中：給定元素寬度（可用①．具體畫素大小；②．min-width||max-width；③．佔父元素％數），和元素高度，然後再給定margin的值為「0 auto」，line-height=height。

（2）取消table元素內雙邊框情況：設定border-spacing值為0。或者設定border-collapse: collapse。

1.心得：也算是踩著坑了，通篇id命名元素，沒有class命名，導致樣式設定起來太多重複的樣式，層次關係太不明了。語義化標籤命名有待提高，大部分都是拼音。。

2.知識點：（1）設定背景影象是否固定或隨頁面其餘部分滾動。

body

設定背景影象固定||隨其他元素滾動||繼承父元素的樣式。

（2）利用css畫1/4圓。

給div設定成正方形，即寬高相等，設定與寬高值相等的border-radius值。

1. 心得：美工實在太差，顏色搭配極low。鞏固了定位的運用。

2.知識點：（1）設定如圖的定位，即「備註」文字與「textarea」塊在同行，想讓二者在頂部對齊，可設定「備註」文字的line-height為100%。

（2）去除button按鈕的灰色預設邊框。

方法①：設定與button按鈕background-color同色的邊框；

方法②：設定outline：none。