ofx.comで使用されているCSS

ofx.com（ロンドンの絵とテキスト付きの灰色のボックス）で使用されているCSSを複製しようとしていますが、私の作品は動作しません。私のコードが欠けているかも知れません。ここに私のコードは次のとおりです。ofx.comで使用されているCSS

.generic-hero-blog { 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-size: cover; 
    border-bottom: 3px solid #f79e37; 
    padding: 30px 0; 
} 

.generic-hero--colour--grey { 
    color: #fff; 
} 

.generic-hero--focus-center { 
    background-position: center center; 
} 

.generic-hero--colour--grey .generic-hero--title { 
    color: currentColor; 
} 

.generic-hero--container { 
    border-radius: 10px; 
    padding: 50px 15px 40px; 
    text-align: center; 
} 




</style> 

</head> 

<body> 
    <div class="generic-hero-blog generic-hero--colour--grey generic-hero--focus-center" style=" background-image:url(images/Harlem.jpg)"> 
         <div class="generic-hero--container"> 
         <h3 class=" generic-hero--title">Save with us now></h3> 
         </div> 



         </div>

出典

2017-10-02 Anonymous

は、あなたが働いていないものをよりよく説明できますか？私はちょうどあなたのコードをテストし、よく見える：[Prntscr]（http://prntscr.com/gsa1ma）とこれ[Fiddle]（https://jsfiddle.net/3n6kjbs3/） – Zero

@Zeroフルスケールとテキストの灰色のボックスが表示されません（ofx.comのような） –

その 'currentColor'とは何ですか？ – Zero

私はautoに左右の余白の値を設定し、それをグレー、半透明の背景を与えることによって、それを中心に、コンテナに幅を追加することにより、ゼロのフィドル@更新しました：

.generic-hero--container { 
    background: rgba(60, 60, 60, 0.8); 
    width: 60%; 
    margin: 0 auto; 
}

はフィドルhere

出典

2017-10-02 13:13:09 Kano

相手にお越しいただきありがとうございます –

ofx.comで使用されているCSS

答えて

関連する問題