Я сделал этот фон для веб-страницы, и теперь мне нужно поместить немного текста и изображений в детали, но если я все положу, кроме тега, :: After element каждый раз ниже, пока он не исчезает под страницей..page_part{
background-color: #0a0a0a;
width: 100%;
height: 100vh;
}
.page_part::before {
content: '';
position: absolute;
z-index: 0;
right: 0px;
margin-bottom: 50%;
justify-content: center;
width:50%;
height: 90vh;
background-image: linear-gradient(to top right,#FFBB86FC,#FFBB86FC, #FF3700B3);
clip-path: circle(30% at right 50%);
}
.page_part::after {
content: '';
position: absolute;
z-index: 0;
left:0px;
margin-top: 10%;
width:25%;
height: 80vh;
background-image: linear-gradient(to top right,#ff86fffc,#fdff86fc);
clip-path: circle(30% at left 50%);
}
.page_part h2{
background-color: #111111;
box-shadow: 2.8px 2.8px #1d1d1d;
color: #E0E0E0;
text-align: center;
overflow-y: hidden;
width: auto;
font-weight: bold;
font-size: 3.4vh;
padding: 8px 24px;
}
< /code>
this is the page part
< /code>
Возможно создать Div, который не изменяет позиционирование элемента «до», который я создал только с CSS? < /p>
html < /p>
4
< /code>
css < /p>
.page_part:nth-child(5){
background-color: #0a0a0a;
width: 100%;
height: 100vh;
}
.page_part:nth-child(5)::before {
content: '';
position: absolute;
z-index: 0;
right: 0px;
margin-bottom: 50%;
justify-content: center;
width:50%;
height: 90vh;
background-image: linear-gradient(to top right,#FFBB86FC,#FFBB86FC, #FF3700B3);
clip-path: circle(30% at right 50%);
}
.page_part:nth-child(5)::after {
content: '';
position: absolute;
z-index: 0;
left:0px;
margin-top: 10%;
width:25%;
height: 80vh;
background-image: linear-gradient(to top right,#ff86fffc,#fdff86fc);
clip-path: circle(30% at left 50%);
}
.page_part:nth-child(5) h2{ /* setto gli h2 */
background-color: #111111;
box-shadow: 2.8px 2.8px #1d1d1d;
color: #E0E0E0;
text-align: center;
overflow-y: hidden;
width: auto;
font-weight: bold;
font-size: 3.4vh;
padding: 8px 24px;
}```
Подробнее здесь: https://stackoverflow.com/questions/684 ... n-the-page
Создайте Div, который не влияет на позиционирование других элементов на странице ⇐ Html
Программисты Html
1751375990
Anonymous
Я сделал этот фон для веб-страницы, и теперь мне нужно поместить немного текста и изображений в детали, но если я все положу, кроме тега, :: After element каждый раз ниже, пока он не исчезает под страницей..page_part{
background-color: #0a0a0a;
width: 100%;
height: 100vh;
}
.page_part::before {
content: '';
position: absolute;
z-index: 0;
right: 0px;
margin-bottom: 50%;
justify-content: center;
width:50%;
height: 90vh;
background-image: linear-gradient(to top right,#FFBB86FC,#FFBB86FC, #FF3700B3);
clip-path: circle(30% at right 50%);
}
.page_part::after {
content: '';
position: absolute;
z-index: 0;
left:0px;
margin-top: 10%;
width:25%;
height: 80vh;
background-image: linear-gradient(to top right,#ff86fffc,#fdff86fc);
clip-path: circle(30% at left 50%);
}
.page_part h2{
background-color: #111111;
box-shadow: 2.8px 2.8px #1d1d1d;
color: #E0E0E0;
text-align: center;
overflow-y: hidden;
width: auto;
font-weight: bold;
font-size: 3.4vh;
padding: 8px 24px;
}
< /code>
this is the page part
< /code>
Возможно создать Div, который не изменяет позиционирование элемента «до», который я создал только с CSS? < /p>
html < /p>
4
< /code>
css < /p>
.page_part:nth-child(5){
background-color: #0a0a0a;
width: 100%;
height: 100vh;
}
.page_part:nth-child(5)::before {
content: '';
position: absolute;
z-index: 0;
right: 0px;
margin-bottom: 50%;
justify-content: center;
width:50%;
height: 90vh;
background-image: linear-gradient(to top right,#FFBB86FC,#FFBB86FC, #FF3700B3);
clip-path: circle(30% at right 50%);
}
.page_part:nth-child(5)::after {
content: '';
position: absolute;
z-index: 0;
left:0px;
margin-top: 10%;
width:25%;
height: 80vh;
background-image: linear-gradient(to top right,#ff86fffc,#fdff86fc);
clip-path: circle(30% at left 50%);
}
.page_part:nth-child(5) h2{ /* setto gli h2 */
background-color: #111111;
box-shadow: 2.8px 2.8px #1d1d1d;
color: #E0E0E0;
text-align: center;
overflow-y: hidden;
width: auto;
font-weight: bold;
font-size: 3.4vh;
padding: 8px 24px;
}```
Подробнее здесь: [url]https://stackoverflow.com/questions/68421951/create-a-div-that-has-no-effect-on-positioning-of-the-other-elements-on-the-page[/url]
Ответить
1 сообщение
• Страница 1 из 1
Перейти
- Кемерово-IT
- ↳ Javascript
- ↳ C#
- ↳ JAVA
- ↳ Elasticsearch aggregation
- ↳ Python
- ↳ Php
- ↳ Android
- ↳ Html
- ↳ Jquery
- ↳ C++
- ↳ IOS
- ↳ CSS
- ↳ Excel
- ↳ Linux
- ↳ Apache
- ↳ MySql
- Детский мир
- Для души
- ↳ Музыкальные инструменты даром
- ↳ Печатная продукция даром
- Внешняя красота и здоровье
- ↳ Одежда и обувь для взрослых даром
- ↳ Товары для здоровья
- ↳ Физкультура и спорт
- Техника - даром!
- ↳ Автомобилистам
- ↳ Компьютерная техника
- ↳ Плиты: газовые и электрические
- ↳ Холодильники
- ↳ Стиральные машины
- ↳ Телевизоры
- ↳ Телефоны, смартфоны, плашеты
- ↳ Швейные машинки
- ↳ Прочая электроника и техника
- ↳ Фототехника
- Ремонт и интерьер
- ↳ Стройматериалы, инструмент
- ↳ Мебель и предметы интерьера даром
- ↳ Cантехника
- Другие темы
- ↳ Разное даром
- ↳ Давай меняться!
- ↳ Отдам\возьму за копеечку
- ↳ Работа и подработка в Кемерове
- ↳ Давай с тобой поговорим...
Мобильная версия