fixed. Отлично. А что по поводу sticky?sticky у родителя должно быть relative, а у элемента с sticky должна быть указана точная позиция top например.
может быть что при скролле страница прыгает так, как стает хедер в фикс позиционирование и двигается все блоки вверх?
<!DOCTYPE html>
<html lang="ru">
<head>
<title>SVG ICON</title>
<style type="text/css">
:root {
--body-bg: #FFFFFF;
--traffic-black: #464F5D;
--traffic-grey: #2F3744;
--traffic-red: #FF0000;
--traffic-yellow: #FFFF00;
--traffic-green: #00FF00;
}
@media (prefers-color-scheme: dark) {
:root {
--body-bg: #000000;
--traffic-black: #CCCCCC;
--traffic-grey: #FFFFFF;
--traffic-red: #FFFFFF;
--traffic-yellow: #0000FF;
--traffic-green: #FF0000;
}
}
body {
background-color: var(--body-bg);
}
.svg-black{
fill: var(--traffic-black);
}
.svg-grey{
fill: var(--traffic-grey);
}
.svg-red{
fill: var(--traffic-red);
}
.svg-yellow{
fill: var(--traffic-yellow);
}
.svg-green{
fill: var(--traffic-green);
}
</style>
</head>
<body>
<div>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<path class="svg-black" d="M342.1,512H169.9c-11,0-19.9-8.9-19.9-19.9V19.9c0-11,8.9-19.9,19.9-19.9h172.1c11,0,19.9,8.9,19.9,19.9v472.3
C361.9,503.1,353,512,342.1,512"/>
<path class="svg-grey" d="M44.1,53c0,29.3,23.7,53,53,53h8.8c24.4,0,44.1,19.7,44.1,44.1V53H44.1z M44.1,203c0,29.3,23.7,53,53,53h8.8
c24.4,0,44.1,19.7,44.1,44.1V203L44.1,203L44.1,203z M44.1,353.1c0,29.3,23.7,53,53,53h8.8c24.4,0,44.1,19.7,44.1,44.1v-97.1
L44.1,353.1L44.1,353.1z M467.9,53c0,29.3-23.7,53-53,53h-8.8c-24.4,0-44.1,19.7-44.1,44.1V53H467.9z M467.9,203
c0,29.3-23.7,53-53,53h-8.8c-24.4,0-44.1,19.7-44.1,44.1V203L467.9,203L467.9,203z M467.9,353.1c0,29.3-23.7,53-53,53h-8.8
c-24.4,0-44.1,19.7-44.1,44.1v-97.1L467.9,353.1L467.9,353.1z"/>
<path class="svg-green" d="M309,406.1c0,29.3-23.7,53-53,53s-53-23.7-53-53s23.7-53,53-53S309,376.8,309,406.1"/>
<path class="svg-yellow" d="M309,256c0,29.3-23.7,53-53,53s-53-23.7-53-53s23.7-53,53-53S309,226.7,309,256"/>
<path class="svg-red" d="M309,105.9c0,29.3-23.7,53-53,53s-53-23.7-53-53s23.7-53,53-53S309,76.7,309,105.9"/>
</svg>
</div>
</body>
</html>Видел, как человек написал position: relative сделать под overflow-y: scroll, но мне это не подходит, так как у меня проблема с наложением тогда появляется.Значит вы что-то делаете не правильно, либо решение должно быть другим, но отталкиваться от правил.
getTextDirections и setTextDirections попробуйте передать стили для текста.
Возможно ли, при внесении такого изменения в шаблон автоматически изменить это свойство в уже созданных книгах по этому шаблону?
@media (prefers-color-scheme: dark) {
/* css код тёмной темы */
}:root {
--main-color: #2a2a2e;
--body-bg-color: #f9f9fa;
}
@media (prefers-color-scheme: dark) {
:root {
--main-color: #f9f9fa;
--body-bg-color: #2a2a2e;
}
}
body {
background-color: var(--body-bg-color);
color: var(--main-color);
}там картинка ниже перекрывала отрицательным марджином кнопку
добавила z индекс и всё ок,
Джон Мюллер
Но обычно имя файла не предоставляет никакой реальной уникальной информации. Если вы не делаете alt-текст или у вас изображения не окружены тематическим контентом, то, конечно, имя файла может быть единственным местом, где вы упоминаете, о чем это изображение.
Яндекс Справка
Кроме значений атрибутов alt и title при поиске по картинкам используются следующие тексты:
тексты ссылок на картинки с других страниц и с других сайтов;
прилегающий к картинке текст — расположенный на странице в непосредственной близости к картинке;
тексты и заголовки коротких документов, обрамляющих одиночную картинку;
имена файлов и скриптов картинок, в том числе с учётом транслитерации и упрощённого подстрочного перевода.
Однако атрибуты alt и title являются наиболее универсальными, поэтому их стоит прописывать всегда.
а он делает ссылки вида 4o0a2tjfviq.d3b544e45bb871ba4d1bdcba0c3ffb391.jpg - т.е. не очень адаптивные для SEO.
Я подкоркой мозга интуитивно чувствую в чем проблема, но как ее решить не знаю
const form = document.querySelector('form'),
submites = [...form.querySelectorAll('input[type=submit]')],
onClicked = function(e) {
//e.preventDefault();
console.log('Click', e.target.name);
//return !1;
},
onSubmites = function(e){
//e.preventDefault();
console.log('Submit', e.submitter.name);
//return !1;
};
form.addEventListener('submit', onSubmites);
submites.forEach((a, b, c) => {
a.addEventListener('click', onClicked);
});let count = 0;
const str = "segment(0-2-10__0-2-18).mp3";
const arr = [str, str];
arr.forEach((f) => {
let regExFilesExtension = /\.mp3$/i;
let bol = regExFilesExtension.test(f);
console.log(f, bol);
count += bol ? 1 : 0;
});
console.log(`count = ${count}`);