2017-10-01 08:54:32 ｃｓｓお勉強 背景画像

　2017-10-01 08:54:32　ｃｓｓお勉強 背景画像　　お気に入り　http://www.htmq.com/

背景画像　透過　全体　

使用している画像

ソース　文字まで透過する。

< div style="border: #cccccc solid 1px; width: 100%; background-image: url('https://blogimg.goo.ne.jp/user_image/71/38/db2576f65207b6336bd0051ea23d6bbf.png'); filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;" >

背景画像　透過　全体 　background-color: rgbaで透過

使用している画像

ソース

< div style="border: 1px solid #cccccc; width: 100%; background-image: url('https://blogimg.goo.ne.jp/user_image/71/38/db2576f65207b6336bd0051ea23d6bbf.png');"　>　
　< div style="background-color: rgba(255,255,255,0.8);"　>　
　左から 赤、緑、青、透過の度合い(0～1)

　背景画像　縦並び左

使用している画像

ソース

< div style="border: #cccccc solid 1px; width: 100%; background-image: url('https://blogimg.goo.ne.jp/user_image/71/38/db2576f65207b6336bd0051ea23d6bbf.png'); background-repeat: repeat-y;" >

  背景画像　縦並び右端        

使用している画像

ソース

< div style="border: #cccccc solid 1px; width: 100%; background-image: url('https://blogimg.goo.ne.jp/user_image/22/6c/af2e5d40a029449443121ab214ddaef9.png'); background-repeat: repeat-y; background-position: right top;" >

http://www.dspt.net/stylesheet_css/004/003.html

背景画像　縦並び右         

使用している画像

ソース

< div style="border: #cccccc solid 1px; width: 100%; background-image: url('https://blogimg.goo.ne.jp/user_image/22/6c/af2e5d40a029449443121ab214ddaef9.png'); background-repeat: repeat-y; background-position: 80% 40;" >

http://www.dspt.net/stylesheet_css/004/003.html

---