opacity 跟 background 差別

• opacity 子元素都會受影響，也會變成透明
• background-color 子元素就不會影響

example

opacity

<style>
.bg{
background: url("/images/alphaBG.png");
width: 800px;
height:600px;
background-position:center;
color:black;
font-size:8rem;
opacity:.6;
}
.bg-txt{
width:100%;
height:100%;
display:flex;
justify-content:center;
align-items:center;
}
</style>
<div class='bg'>
    <div class='bg-txt'>
        Test
    </div>
</div>

上面的範例連文字都會有透明

backgroud

<style>
.bg{
background: url("/images/alphaBG.png");
width: 800px;
height:600px;
background-position:center;
color:black;
font-size:8rem;
}
.bg-txt{
width:100%;
height:100%;
background: rgba(255,255,255,.3);
display:flex;
justify-content:center;
align-items:center;
}
</style>
<div class='bg'>
    <div class='bg-txt'>
        Test
    </div>
</div>

文字不會透明了，只有背竟有透明一點

參考資料

CSS Opacity VS Alpha | Opacity 跟 Alpha的差異 | 調整透明度 CSS實現背景圖片透明，文字不透明效果

最近剛好在使用 fetch 代替 ajax ，剛好遇到了一些小問題，所以寫下來提醒一下自己

fetch 是一個新的 API 可以讓我們可以去做 AJAX ，而且用起來更直觀

當要使用 fetch 來做 POST 我們可以用以下的寫法:

fetch(URL,{
    method:'POST',
    method: 'cors'  // 用來作為 跨域請求用的
})

這樣就可以使用 fetch 發出 POST 的請求，當我們要附上資料時，可以用 FormData 這一個 class 來帶上我們的資料

const fd = new FormData([可以直接指定 dom 元素是 form 的])

const fd = FormData();
fd.append('key',value);

可以用以上兩種方法來給 FormData 資料

最後只需要把 FormData 帶入 fetch 中的欄位，就可以成功帶上資料了

fetch(URL,{
    method:'POST',
    method: 'cors',  // 用來作為 跨域請求用的
    body: fd
})

這邊不需要去指定 Content-Type ，因為 fetch 會幫我們帶上適當的屬性

最近重新架 PHP 的環境，在使用 session 的時候發現了問題，當我在這個網頁設定了 session 後， 當我跳轉到另一個網頁後，發現 session 不見了!!!!

我確認了一下我有沒有開啟 session(session_start()) ， 也確認了我是在同一個網域底下，結果是我在其中一個關鍵的 php 檔案沒有開啟…

於是我上網找了一下有沒有可以避免的方法，發現是 session.auto_start ，它可以自動幫我們開啟 session ，這樣就不會有時忘了開了，可以在 php_info() 中找找看，如下圖，如果確認沒有開後，可以到 php.ini 裡去改掉他

session.auto_start=1 這樣應該就可以了