Вопросы Теги

Дочерние элементы, наследующие цвет фона

function storeUserPrefs() {
    var key='myKey', testPrefs = {'val': 10};
    chrome.storage.sync.set({[key]: testPrefs}, function() {
      console.log('Saved', key, testPrefs);
    });
}

Вы можете просто заставить оценить ключ переменной, используя [ключ] при сохранении. Таким образом, вы можете легко настроить свои клавиши динамически. Надеюсь, что это поможет.

1
задан Lorenzo 9 March 2019 в 16:09
поделиться

2 ответа

Вы можете задать свой .spannerBg :: before a z-index: -1 и .spannerBg a z-index: 1 [ 1110]

Элемент before теперь движется за своими братьями и сестрами. 

.spannerBg {
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-color: rgba(255, 150, 0, 0.5);
  min-height: 300px;
  z-index: 1;
}

.spannerBg::before {
  content: "";
  display: block !important;
  background-color: inherit;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

p {
  font-size: x-large;
}
<div class="spannerBg" style="
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
    background-image:url(https://images.pexels.com/photos/1051075/pexels-photo-1051075.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260)">

  <p>Somecontent</p>

</div>
<div>
  beiwrfa<br>ewnifiebfia<br>fbjwqbfwebfj<br>
</div>
<div class="spannerBg" style="
    background-image:url(https://images.pexels.com/photos/865711/pexels-photo-865711.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260)">
  <p>Somecontent</p>
</div>

<div>
  <p>somecontent</p>
</div>

0
ответ дан d-h-e 9 March 2019 в 16:09
поделиться

Надеюсь, это поможет: 

.spannerBg {
background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	min-height: 300px;
}

.spannerBg::before {
	content: "";
	display: block !important;
	background-color: inherit;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

}
<div class="spannerBg" style="
background-image: linear-gradient( rgba(255, 150, 0, 0.5), rgba(255, 150, 0, 0.5) ), url(https://images.pexels.com/photos/865711/pexels-photo-865711.jpeg);
">
    <p>Somecontent</p>
</div>

0
ответ дан How to stuff 9 March 2019 в 16:09
поделиться