(async function() {
const isExists = async function(url) {
const response = await fetch(url, {
method: 'HEAD'
})
return response.status == 200
}
console.log(await isExists('https://hsto.org/r/w60/files/448/7d0/72f/4487d072f40f4f8e84854aea5794c990.png'))
})()
.page
.page__header
.header
.page__wrapper
.page__block1
.block1 // это блок страницы, замените на свое название
.page__block2
.block2
.page__footer
.footer
Нужно ли везде указывать, что это за страница?
Ведь services этот блок, который может повторятся и на других страницах сайта, и при этом, будет выглядеть по другому.
Конечно, если полностью следовать БЭМ, должна появиться и такая же структура файлов. Но если мне необходимо все стили запихать в один css?
Или нужно избегать повторения в именование классов?
/*Viewport Height Correction
https://github.com/Faisal-Manzer/postcss-viewport-height-correction
.foo {
height: 100vh;
height: calc(var(--vh, 1vh) * 100); //
}
*/
var customViewportCorrectionVariable = 'vh';
function setViewportProperty(doc) {
var prevClientHeight;
var customVar = '--' + ( customViewportCorrectionVariable || 'vh' );
function handleResize() {
var clientHeight = doc.clientHeight;
if (clientHeight === prevClientHeight) return;
requestAnimationFrame(function updateViewportHeight(){
doc.style.setProperty(customVar, (clientHeight * 0.01) + 'px');
prevClientHeight = clientHeight;
});
}
handleResize();
return handleResize;
}
window.addEventListener('resize', setViewportProperty(document.documentElement));
/*/Viewport Height Correction*/
<div class="row">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</div>
.row {
margin-right: -15px;
margin-left: -15px;
}
.row:before,
.row:after {
display: table;
content: " ";
}
.row:after {
clear: both;
}
.col {
float: left;
width: 33.33333333%;
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
<div class="styled-class">
<p>Текст</p>
<p>Текст</p>
</div>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">