2017-04-14 8 views
1

CSS에서 Google 광고 정보 버튼의 배경색을 변경하는 방법. Google은 광고를 사용자 정의했지만 Google 광고 정보 버튼의 배경색을 변경할 수 없습니다. 색상을 변경 한 네이티브 광고를 보았습니다. 심지어 삭제하더라도 삭제되지 않는 코드의 모든 부분을 추가하므로 배경색을 어떻게 바꿀 수 있습니까? 나는 CSS 코드 및 admobCssAdmob 기본 광고 CSS Google 정보 버튼 배경색

/* Note: 1px = 1dp in this css */ 

/* == Colors == */ 
body { 
    background-color: #ffffff; 
} 
.title-link { 
    color: #000000; 
} 
.button { 
    background-color: #9D0000; 
} 
.button-text, 
.button-link { 
    color: #FFFFFF; 
} 
.price, 
.reviews { 
    color: rgba(0,0,0,0.5); 
} 
.reviews svg { 
    fill: rgba(0,0,0,0.7); 
} 
.url-link { 
    color: rgba(0,0,0,0.3); 
} 
.body { 
    color: rgba(0,0,0,0.7); 
} 

/* == Fonts == */ 
body { 
    font-family: "Lobster"; 
    font-weight: normal; 
    font-size: 10px; 
} 
@media (min-height: 300px) { 
    body { 
    font-size: 11px; 
    } 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    body { 
    font-size: 12px; 
    } 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    body { 
    font-size: 16px; 
    } 
} 
.title { 
    font-size: 1.1em; 
    line-height: 1.2em; 
} 
.button { 
    font-size: 1.1em; 
} 
.body, 
.price, 
.reviews, 
.url { 
    font-size: 1em; 
    line-height: 1.1em; 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    .title { 
    font-size: 1.2em; 
    line-height: 1.25em; 
    } 
    .button { 
    font-size: 1.2em; 
    } 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .title { 
    font-size: 1.3em; 
    line-height: 1.35em; 
    } 
    .button { 
    font-size: 1.3em; 
    } 
} 

/* == Layout == */ 
.title { 
    margin-bottom: 5px; 
    padding: 5px 0 0 8px; 
} 
.body { 
    margin: 2px 8px; 
} 
.button { 
    position: absolute; 
    bottom: 8px; 
    left: 8px; 
} 
/* == App install and video ad layouts == */ 
.app-icon { 
    float: left; 
    margin: 0 8px 4px 8px; 
    padding: 0; 
} 
.image-gallery, 
.video { 
    margin: 0 auto 8px auto; 
} 
/* == Content ad layout == */ 
.image { 
    margin: 0 auto 4px auto; 
} 

/* == Body == */ 
.body { 
    /* add more customizations here */ 
} 

/* == App icon == */ 
.app-icon img { 
    height: 50px; 
    width: 50px; 
    border-radius: 20%; 
} 
@media (min-width: 360px) and (min-height: 300px) { 
    .app-icon img { 
    height: 70px; 
    width: 70px; 
    } 
} 

/* == Title == */ 
.title { 
    display: block; 
    text-align: left; 
} 

/* == Button == */ 
.button { 
    border: none; 
    border-radius: 20px; 
    box-shadow: 0 0 2px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.24); 
} 
.button-link { 
    display: block; 
    position: relative; 
    padding: 0 1em; 
} 
.button svg { 
    display: none; 
} 
.button { 
    width: 90%; 
    width: calc(100% - 16px); 
    height: 2.8em; 
} 
.button-text { 
    display: block; 
    line-height: 2.8em; 
    text-align: center; 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .button { 
    height: 2em; 
    } 
    .button-text { 
    line-height: 2em; 
    } 
} 

/** 
* == Large image and video == 
* App install: 
* Use .image-gallery selector 
* Content: 
* Use .image selector 
* Video: 
* Use .video selector 
*/ 
.image-link, 
.image img { 
    width: 100%; 
    height: 100%; 
} 
.image-gallery a, 
.image a { 
    display: block; 
    line-height: 0; 
} 
.image-gallery, 
.video, 
.image { 
    width: 90%; 
    width: calc(100% - 16px); 
} 
.image-gallery, 
.video { 
    height: 50%; 
    height: calc(100% - 11em); 
} 
.image { 
    height: 50%; 
    height: calc(100% - 10em); 
} 
@media (min-width: 700px) and (min-height: 300px) { 
    .image-gallery, 
    .video { 
    height: calc(100% - 8.5em); 
    } 
    .image { 
    height: calc(100% - 8em); 
    } 
} 

/* == Attribution == */ 
.attribution { 
    background-color: #ffffff; 
    border-radius: 2px; 
    color: #aeaeae; 
    display: table; 
    font-size: 10px; 
    line-height: 13px; 
    margin: 4px 8px; 
    padding: 0 3px; 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
.rtl .attribution { 
    background-color: #ffffff; 
    left: auto; 
    right: 0; 
} 

/* == Other == */ 
.ads a { 
    text-decoration: none; 
} 
.ads, .ad { 
    /** 
    * DO NOT TOUCH OR REMOVE 
    * Will break image rendering 
    */ 
    height: 100%; 
    width: 100%; 
    padding: 0; 
    word-wrap: break-word; 
} 
.ad { 
    /* Padding for attribution */ 
    padding-top: 23px; 
    height: calc(100% - 23px); 
} 

@DanielStorm 그것을 변경하는 방법을 발견 사진을 추가했습니다하지만 지금 몹은 admob does not allow

+0

이 AdMob의에서 CSS입니다. com 광고를 만들 때 정확합니까? –

+0

예, 광고 폭탄 네이티브 광고 – BaranBerk

답변

0

내가 CSS 정말 익숙하지 해요 허용하지 않지만 요소를 검사 할 수 있습니다 ID가 abgbg이고 기본적으로 색상이 #cdcccc으로 설정되어 있는지 확인합니다. 스크린 샷에서 주황색 (# FFA500)으로 변경했습니다. 나는 이것을 CSS로 표현하는 방법이나 그것이 가능할 지 모르겠다. 그러나 이것은 올바른 방향으로 당신을 지적해야한다.

enter image description here


편집 :

miniute 주변에 그것으로 연주 후에는과 같이 배경 색상을 변경할 수 있습니다

.abgbg { 
    fill: #FFFFFF !important; 
} 
+0

Daniel에게 당신이 옳았으나 adMob은 그러한 변경을 허용하지 않습니다. 그것은 말합니다 : 귀하의 지역 광고 단위에 1 개의 창조적 스타일 오류가 있습니다. 광고 단위를 저장하려면 먼저 이러한 오류를 수정하고 광고 단위를 다시 확인해야합니다. 자세히 알아보기 여러 광고 유형의 경우 \t ".abgbg"를 사용할 수 없습니다. – BaranBerk

+0

.abgbg { 채우기 : #FFFFFF! important;를 추가 할 때 스타일을 확인할 수 없습니다. } – BaranBerk

+0

@BaranBerk 아 이제 알겠습니다. 광고 단위를 저장하지 않았습니다. 나는 이것이 가능하다고 생각하지 않는다. 귀하의 질문에 구현 된 광고 예제 사진을 추가 할 수 있습니까? 아마 그들은 다른 방식으로이 일을 진행할 것입니다. –