第四章 背景影象效果
4.1 背景影象基礎
background-repeat（除了repeat, no-repeat, repeat-x, repeat-y還有round，space）， background-position我還沒用過呢= =
background-attachment：scroll/fixed
靈活的圓角框
"因為沒有給這個框設定高度，所以它會隨著文字尺寸的增加進行垂直擴充套件"
滑動門技術：因為乙個影象在另乙個影象上滑動，將它的一部分隱藏了起來。
這個方法需要4個影象：兩個頂部影象組成頂部曲線，兩個底部影象組成底部曲線和框的主體。因此，底部影象的高度必須與框的最大高度相同（？？？）
照著書上抄**嘗試，結果卻怎麼也顯示不出來，看了好久才發現是url中多了一斜槓。本是img/***.gif寫成/img/***.gif就不行了。html中url路徑請求的六種方式：無斜槓、單斜槓（/）、點+單斜槓（./）、點點+單斜槓（../）、多個點點+單斜槓（../../）、全路徑
我之前忽略了乙個問題，就是背景影象不一定是要全部顯示出來的，預設情況下是會產生截短的吧。此外要使用多層巢狀才能產生覆蓋效果嗎？嘗試在同一div裡加了第二層背景圖結果完全沒有背景了。不過似乎是我寫法有問題。
可以在同一div中新增多張背景圖，不過背景圖的新增的先後順序非常重要，寫在前面的會被放在最上面。
如background:url("img/top-right.gif") top right no-repeat,
url("img/bottom-right.gif") bottom right no-repeat,
url("img/top-left.gif") top left no-repeat,
url("img/bottom-left.gif") bottom left no-repeat;
這就是滑動門，可以學下一部分了。
山頂角
border-image：允許指定乙個影象作為元素邊框。但似乎該元素需要在橫向和縱向都對稱才能獲得勉強可以的效果...
又在網上找到了一篇關於山頂角的博文，乙個處理border的trick。鏈結在這裡：css實現山頂角的原理
看到一半就立刻去寫了下對話方塊，其上突出的角我的處理辦法是兩個山頂角疊加，乙個是邊框顏色乙個是中間文字的背景色，很容易想到的解決辦法 。demo如下：
excusez moi???
a.自己雖然解決了但仍然不懂是什麼原理。我把angle用絕對定位移到container之下，但是移出去的部分都消失了，想了半天也不明白為什麼，猜測也許能利用overflow解決，便試成功了。
b.我定位void的時候又出岔子了，void不在我想要的地方，一瞬間我又覺得自己可能白學定位了。不過想了一會兒，我突然發現void的定位點是在angle內的，而不是在邊框上，因為此處angle的高寬都設為0了，而其主體全是border，潛意識裡又認為定位起點在可看見的地方。
此外不要忘了border的每邊長度並非得一樣的。所以可以做出長方形blah blah
4.3 投影
4.3.1 簡單的css投影
「因為div是塊級元素，所以它們會水平伸展，佔據所有可用空間」
《精通css》中講投影部分是用製作的陰影作為背景新增在影象其後...（out of fashion）
css視差效果
只是改變了background-position的值.原理不是很清楚了。
影象替換
（我都不知道是個什麼效果）
讀書記錄 《我們》
美麗新世界 阿道司 赫胥黎 著 蠅王 威廉 戈爾丁 著 阿特拉斯聳聳肩 安 德蘭 著 著名的三大反烏托邦 之一。書名很有意思，在書中 我們 是書中喪失社會屬性 只依靠編號表示的群體的統稱，也讓我想起書中的d503和i330 他們的愛情是這本書的主線 雖然整個進展是我們借被抽掉 愛情 屬性的主角的目光...
2023年讀書記錄
1 富爸爸與窮爸爸 這是一本理財入門書籍，我在知乎上了解到的，閱讀的初衷是我發現，我理財的知識缺少的令人髮指，在現在這個社會，如果是還是一味的只知道埋頭苦幹 為老闆掙錢 我想這 一輩子也就這麼著了。這裡面我學到了什麼是為錢工作 比如現在工作，還貸。什麼是錢為我們工作 投資理財 什麼是資產，什麼是負債...
head first設計模式讀書記錄
設計原則 1 針對介面程式設計而非針對實現 2 多用組合，少用繼承 3 復用的潛力 4 封裝變化 5 開閉原則 對擴充套件開放，對修改關閉 6 依賴倒置原則 7 越常用，越不應修改，把可能的修改扔給必須要改的部分，最好扔給擴充套件。封裝變化 8 最少知識原則 減少類與類的重合，只與密友交流 9 越懶...