gocha124の日記

ごちゃごちゃ書きます

Facebookの背景透明グレーで今なにしてる?のとこ

背景透明グレーで「今なにしてる?」の背景が白色のとこがどうなっているか見てみた。

 

html 

<div data-reactroot role="dialog" class="_3u13 _3e9r _3u14 _1b3n">

 <div class="_3u15" role="presentation"></div>

 <div class="_3u16">

  <div display="block">

   <div data-reactroot class="_s7h _36bx _4a60 _4-u2 _4-u8" data-testid="react-composer-root" id="rc.u_jsonp_2_j">

 

css

1、背景透明グレーは。

._3u14 ._3u15 {

 bottom: 0%;

 opacity: .6; /* ←透明60%*/

 transition: opacity .3s;

}

で、presentationのとこにopacity: .6;を効かせて、透明にしている。

._3u13 ._3u15 {

 background: #000; /* 黒色*/ /*←くろ*/

 bottom: 100%;

 left: 0;

 opacity: 0;

 position: fixed;

 right: 0;

 top: 0;

 transition: opacity .3s, bottom 0s .3s;

 z-index: 310;

}

で、background: #000;で黒を透明にして、透明灰色。

 

2、あと「今なにしてる?」の白色は、

._3u14 ._3u16 {

 position: relative;

 z-index: 311 !important;

}

で、<divの括りを一つ前方に出して

._4-u8 {

 background-color: #fff; /* 白色 */

}

で「今なにしてる?」の背景を白色。