Комментарии пользователя Максим Головлёв

Почему не подключается CSS файл?

Максим Головлёв @golovlevarts Автор вопроса

Спасибо за помощь

Написано более двух лет назад

Какой приоритет операций в WHERE?

Максим Головлёв @golovlevarts Автор вопроса

hint000, более чем понятно, спасибо.

Написано более трёх лет назад

Как правильно разместить позиционирование html элемента?

Максим Головлёв @golovlevarts Автор вопроса

Wispik, сейчас просто видео на бг, остальных элементов не видно

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="MAIN.CSS">
    <title>desolate</title>
</head>
<body>
<div class="content">

<div class="aboutme">
<div class="avatar">
<div class="nickname">
<div class="info">streamer / nolifer / dota 2 player
<div class="video-bg"><video autoplay muted loop class="background-video">
<source src="image/Overlay_Start_01_2.webm" type="video/mp4"></video>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;800&display=swap');

body {

}
.content {
    position: relative;
}

.video-bg {
    position: absolute;
}
/* Style the video: 100% width and height to cover the entire window */

.background-video {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}

.aboutme {
    margin: 0 auto;
    width: 440px;
    height: auto;
}

.avatar {
    background-image: url(image/avatar.jpg);
    width: 126px;
    height: 126px;
    border-radius: 50%;
    margin: 170px auto 0px;
}

.nickname {
    background-image: url(image/nickname.png);
    width: 442px;
    height: 31px;
    margin: 24px auto 0px;
}

.info {
    width: 232px;
    height: auto;
    margin: 10px auto 0px;
    color: #8B8B8B;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    letter-spacing: 0.1em;
}

Написано более трёх лет назад

Как правильно разместить позиционирование html элемента?

Максим Головлёв @golovlevarts Автор вопроса

Вот так?
Не вышло.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="MAIN.CSS">
    <title>desolate</title>
</head>
<body>
<div class="content">
<video autoplay muted loop id="background-video">
<source src="image/Overlay_Start_01_2.webm" type="video/mp4"></video>
<div class="aboutme">
<div class="avatar">
<div class="nickname">
<div class="info">streamer / nolifer / dota 2 player
</div>
</div>
</div>
</div>
</div>
</body>
</html>

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;800&display=swap');

body {

}
.content {
    position: relative;
}


/* Style the video: 100% width and height to cover the entire window */

.background-video {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}

.aboutme {
    margin: 0 auto;
    width: 440px;
    height: auto;
}

.avatar {
    background-image: url(image/avatar.jpg);
    width: 126px;
    height: 126px;
    border-radius: 50%;
    margin: 170px auto 0px;
}

.nickname {
    background-image: url(image/nickname.png);
    width: 442px;
    height: 31px;
    margin: 24px auto 0px;
}

.info {
    width: 232px;
    height: auto;
    margin: 10px auto 0px;
    color: #8B8B8B;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    letter-spacing: 0.1em;
}

Написано более трёх лет назад

Как посчитать прогноз на показатель SL?

Максим Головлёв @golovlevarts Автор вопроса

был бы вам очень благодарен, если бы скинули самый подходящий, на ваш взгляд

Написано более трёх лет назад

Почему анимация в protopie тормозит?

Максим Головлёв @golovlevarts Автор вопроса

спасибо

Написано более трёх лет назад

Почему не видно background?

Максим Головлёв @golovlevarts Автор вопроса

Иван В, спасибо вам!

Написано более трёх лет назад

Почему не видно background?

Максим Головлёв @golovlevarts Автор вопроса

Артем Будин, а есть ещё варианты?

Написано более трёх лет назад

Почему не видно background?

Максим Головлёв @golovlevarts Автор вопроса

Артем Будин, уже задал значения длины и ширины, вот так это выглядит (так и должно):

в неактивном состоянии используется пикча с заливкой, в ховере без, если подскажете мне как это реализовать через css - очень выручите

Написано более трёх лет назад

Как спозиционировать див?

Максим Головлёв @golovlevarts Автор вопроса

Ankhena, благодарю

Написано более трёх лет назад

Как спозиционировать див?

Максим Головлёв @golovlevarts Автор вопроса

в таком случае, корректно ли задать диву poertfolio 2 значения position (absolute для позиционирования и relative для того, чтобы позиционировать work1 относительно него) или есть какой-то другой способ?

Написано более трёх лет назад

Как сделать hover для иконки и текста сразу?

Максим Головлёв @golovlevarts Автор вопроса

Артем Будин, вы правы, мне бы явно не помешало изучить основы вёртски, но вот дело в том, что я этим не занимаюсь и не планирую, это разовая попытка сверстать для себя сайт-портфолио.
За помощь, кстати, большое спасибо - помогло.

Написано более трёх лет назад

Как сделать hover для иконки и текста сразу?

Максим Головлёв @golovlevarts Автор вопроса

разве сейчас иконка mailicon не "запихнуты" в "mail", которому предан hover?

Написано более трёх лет назад

Как сделать иконки в один ряд?

Максим Головлёв @golovlevarts Автор вопроса

Большое спасибо за помощь. Был бы благодарен, если бы в общих чертах объяснили мне решение проблемы, но это уже вовсе не обязательно)

Написано более трёх лет назад

Почему не отображаются иконки?

Максим Головлёв @golovlevarts Автор вопроса

Рома Зварич, спасибо большое за помощь

Написано более трёх лет назад

Почему не отображаются иконки?

Максим Головлёв @golovlevarts Автор вопроса

Рома Зварич, изначально, задав блокам с иконками размеры, они всё так же не появились, после того, как убрал значение margin-left, получилось следующее:

Написано более трёх лет назад

Почему не отображаются иконки?

Максим Головлёв @golovlevarts Автор вопроса

Рома Зварич, не помогло, вот иконки:

Написано более трёх лет назад

Почему не отображаются иконки?

Максим Головлёв @golovlevarts Автор вопроса

добавил inline-block к необходимым элементам, иконок mail и telegram всё ещё нету (остальные появились)

Написано более трёх лет назад

Почему не отображаются иконки?

Максим Головлёв @golovlevarts Автор вопроса

Сергей Карвасарный, спасибо, отчасти помогло (иконки mail и telegram до сих пор не отображаются)

Написано более трёх лет назад

Как задать стиль текста в диве?

Максим Головлёв @golovlevarts Автор вопроса

Иван В, и получилось у меня:

вместо:

<!DOCTYPE html>
<html lang="rug">
<head>
	<meta charset="UTF-8">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="shortcut icon" type="image/x-icon" href="images/">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap" rel="stylesheet">
	<title>WELOVEDESIGN</title>
</head>
<body>
<div class="nav">
    <div class="logo"></div>
    <div class="razdelitel"></div>
    <div class="social">
        <a class="be" href="#"></a>
        <a class="insta" href="#"></a>
        <a class="vk" href="#"></a>
    </div>
    <div class="contacts">
    <div class="mail">
  <a>PRIMER@GMAIL.COM</a>
</div>
<div class="telegram">
  <a>@PRIMER</a>
</div>
    </div>
</div>
    </body>
</html>

body {
    font-size: 10px;
    font-family: 'Open Sans', sans-serif;
	background: #000000;

}
.nav {
    width: 1720px;
    display: flex;
    margin: 80px auto 0 auto;
    flex-flow: row nowrap;
}

.logo {
    width: 287px;
    height: 28px;
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
}

.razdelitel {
    margin-left:35px;
    width: 1px;
    height: 28px;
    background-color: #5b5b5b;
}

.be {
    margin-top: 6px;
    margin-left: 35px;
    width: 21px;
    height: 16px;
    background-image: url(../images/be.png);
    background-repeat: no-repeat;
    
}

.be:hover {
    transition: 1s;
    margin-top: 6px;
    margin-left: 35px;
    width: 21px;
    height: 16px;
    background-image: url(../images/behover.png);
    background-repeat: no-repeat;
    
}

.insta {
    margin-top: 6px;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/insta.png);
    background-repeat: no-repeat;
    
}

.insta:hover {
    transition: 1s;
    margin-top: 6px;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/instahover.png);
    background-repeat: no-repeat;
    
}

.vk {
    margin-top: 6px;
    margin-left: 15px;
    width: 21px;
    height: 16px;
    background-image: url(../images/vk.png);
    background-repeat: no-repeat;
    
}

.vk:hover {
    transition: 1s;
    margin-top: 6px;
    margin-left: 15px;
    width: 21px;
    height: 16px;
    background-image: url(../images/vkhover.png);
    background-repeat: no-repeat;
    
}

.mail {
    margin-top: 6px;
    margin-left: 900px;
    width: 20px;
    height: 16px;
    background-image: url(../images/mail.png);
    background-repeat: no-repeat;
}
 
.mail:hover {
    transition: 1s;
    margin-top: 6px;
    margin-left: 900px;
    width: 20px;
    height: 16px;
    background-image: url(../images/mailhover.png);
    background-repeat: no-repeat;
}
 
.telegram {
    margin-top: 6px;
    margin-left: 150px;
    width: 20px;
    height: 16px;
    background-image: url(../images/telegram.png);
    background-repeat: no-repeat;
}
 
.telegram:hover {
    transition: 1s;
    margin-top: 6px;
    margin-left: 150px;
    width: 20px;
    height: 16px;
    background-image: url(../images/telegramhover.png);
    background-repeat: no-repeat;
}


.mail a {
    display: inline-block;
    margin-left: 25px;
    font-weight: 700;
    text-decoration: none;
    color: #5b5b5b;
}

.mail a:hover {
    display: inline-block;
    transition: 1s;
    color: #ff1e4f;
}

.telegram a {
    display: inline-block;
    margin-left: 25px;
    font-weight: 700;
    text-decoration: none;
    color: #5b5b5b;
}

.telegram a:hover {
    display: inline-block;
    transition: 1s;
    color: #ff1e4f;
}

Подскажете, что не так сделал?

Написано более трёх лет назад

Войдите на сайт