Задать вопрос
Ответы пользователя по тегу HTML
  • Почему шрифт рендерится не тем цветом, что я задал в CSS?

    @Steppp
    Все нормально!
    5f5a304ae3109005510958.png
    Ответ написан
    Комментировать
  • Как изменить спрайт на остальных полях?

    @Steppp
    Вообще спрайты по другому делаются! У тебя есть sprite.svg в котором все иконки, и ты от туда достаешь иконку по id!
    Ответ написан
    6 комментариев
  • Как правильно вырезать из шаблона?

    @Steppp
    на нужном блоке правой кнопкой клик, и "посмотреть код",
    а во вкладке styles вытащить css!)
    5f59d668625de792312864.png
    Ответ написан
    Комментировать
  • Как так-же стилизовать input file upload?

    @Steppp
    код от класса visually-hidden можешь на гуглить, он скрывает input
    тоесть ты input и label связываешь через for id,
    и стилизуешь label как тебе угодно)))

    <div class="form__input-file">
        <input class="visually-hidden" type="file" id="file">
        <label for="file">
            тут рисуй рамку и что хочешь делай
            <span>Добавить</span>
        </label>
    </div>
    Ответ написан
    2 комментария
  • Как сделать переход на другую страницу если имя и пароль верно?

    @Steppp
    Если уж прям надо как написано у тебя в вопросе, то вот!
    <div class="steam-box">
        <h2>Login</h2>
        <form>
            <div class="input-box">
                <input type="text" name="login" id="login" required>
                <label>Username</label>
            </div>
    
            <div class="input-box">
                <input type="password" name="password1"  id="password" required>
                <label>Password</label>
                <div id="toggle" onclick=" showHide();"></div>
            </div>
            <input type="submit" value="Sign in">
        </form>
    </div>
    
    <script>
    const form = document.forms[0];
    const text = form.querySelectorAll(`.input-box`);
    
    let textLogin = text[0].querySelector(`label`);
    let textPass = text[1].querySelector(`label`);
    
    form.addEventListener(`submit`, (evt) => {
      evt.preventDefault();
       if (form.elements.login.value === '') {
        textLogin.textContent = `Заполните поле`;
       } else if (form.elements.password.value === '' ) {
        textPass.textContent = `Заполните поле`;
       } else {
        document.location.href = "НТТР: // сайт . ру /";
       }
    });
    Ответ написан
  • Как сделать верхний радиус у блока?

    @Steppp
    <svg class="svg" viewBox="0 0 5056 2334">
        <g transform="translate(0.000000,2334.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">
            <path d="M23780 23265 c-11 -13 -84 -15 -545 -15 -461 0 -534 -2 -545 -15 -11 -13 -77 -15 -483 -15 -396 0 -473 -2 -486 -14 -14 -13 -113 -16 -603 -22 -477 -6 -588 -10 -592 -21 -4 -10 -75 -13 -375 -13 -319 0 -370 -2 -375 -15 -5 -13 -59 -15 -405 -15 -345 0 -400 -2 -405 -15 -9 -24 -222 -22 -249 2 -18 17 -19 17 -28 0 -9 -15 -30 -17 -203 -17 -160 0 -196 -3 -206 -15 -11 -13 -65 -15 -375 -15 -310 0 -364 -2 -375 -15 -11 -13 -65 -15 -375 -15 -310 0 -364 -2 -375 -15 -8 -10 -31 -15 -65 -15 -38 0 -55 4 -59 15 -4 11 -21 15 -61 15 -40 0 -57 -4 -61 -15 -5 -12 -29 -15 -125 -15 -97 0 -121 -3 -125 -15 -5 -13 -50 -15 -322 -15 -281 0 -317 -2 -334 -17 -16 -14 -57 -17 -335 -21 -250 -4 -320 -8 -331 -18 -11 -11 -69 -14 -281 -14 -227 0 -271 -2 -281 -15 -11 -13 -63 -15 -360 -15 -300 0 -349 -2 -354 -15 -4 -13 -36 -15 -199 -15 -161 0 -197 -3 -207 -15 -10 -13 -51 -15 -250 -15 -199 0 -240 -2 -250 -15 -18 -22 -109 -20 -126 3 -13 16 -15 16 -28 0 -11 -16 -32 -18 -160 -18 -121 0 -148 -3 -152 -15 -5 -13 -44 -15 -265 -15 -222 0 -260 -2 -265 -15 -5 -13 -46 -15 -279 -15 -257 0 -273 -1 -290 -20 -16 -18 -32 -19 -268 -20 -208 0 -253 -3 -267 -15 -13 -12 -48 -15 -172 -15 -126 0 -158 -3 -168 -15 -10 -13 -49 -15 -235 -15 -186 0 -225 -2 -235 -15 -10 -12 -45 -15 -200 -15 -155 0 -190 -3 -200 -15 -10 -13 -49 -15 -235 -15 -186 0 -225 -2 -235 -15 -10 -13 -50 -15 -237 -15 -190 0 -225 -2 -229 -15 -5 -12 -32 -15 -154 -15 -119 0 -150 -3 -160 -15 -10 -12 -46 -15 -201 -15 -177 0 -190 -1 -206 -20 -17 -19 -30 -20 -274 -20 -219 0 -258 -2 -263 -15 -4 -12 -27 -15 -119 -15 -90 0 -117 -3 -127 -15 -10 -12 -48 -15 -220 -15 -172 0 -210 -3 -220 -15 -10 -12 -40 -15 -155 -15 -115 0 -145 -3 -155 -15 -10 -12 -37 -15 -125 -15 -88 0 -115 -3 -125 -15 -10 -12 -42 -15 -170 -15 -128 0 -160 -3 -170 -15 -10 -12 -42 -15 -171 -15 -127 0 -161 -3 -173 -15 -11 -12 -42 -15 -140 -15 -105 0 -127 -3 -142 -17 -15 -15 -41 -19 -178 -21 -126 -3 -163 -7 -169 -18 -6 -11 -37 -14 -143 -14 -110 0 -136 -3 -140 -15 -5 -12 -28 -15 -124 -15 -96 0 -119 -3 -124 -15 -4 -12 -33 -15 -171 -15 -138 0 -167 -3 -171 -15 -5 -12 -30 -15 -140 -15 -110 0 -136 -3 -140 -15 -5 -12 -27 -15 -110 -15 -84 0 -106 -3 -110 -15 -5 -12 -34 -15 -170 -15 -137 0 -166 -3 -170 -15 -5 -11 -23 -15 -72 -15 -48 0 -70 -5 -85 -17 -16 -15 -44 -18 -163 -21 -107 -3 -146 -8 -155 -18 -8 -10 -36 -14 -94 -14 -61 0 -86 -4 -95 -15 -10 -12 -39 -15 -140 -15 -101 0 -130 -3 -140 -15 -9 -11 -32 -15 -80 -15 -51 0 -69 -4 -74 -15 -4 -11 -21 -15 -59 -15 -36 0 -59 -5 -67 -15 -10 -12 -39 -15 -140 -15 -101 0 -130 -3 -140 -15 -9 -10 -32 -15 -76 -15 -42 0 -67 -5 -78 -15 -10 -10 -35 -15 -77 -15 -42 0 -68 -5 -79 -15 -12 -10 -49 -17 -116 -22 -67 -4 -102 -10 -107 -19 -5 -10 -30 -14 -76 -14 -49 0 -72 -4 -81 -15 -9 -11 -34 -15 -97 -15 -65 0 -85 -3 -89 -15 -4 -11 -21 -15 -59 -15 -34 0 -57 -5 -65 -15 -7 -8 -29 -15 -50 -15 -24 0 -40 -5 -44 -15 -4 -11 -22 -15 -74 -15 -50 0 -73 -4 -82 -15 -7 -8 -20 -15 -30 -15 -10 0 -23 -7 -30 -15 -7 -8 -20 -15 -30 -15 -21 0 -36 -17 -41 -45 -3 -11 -15 -22 -29 -25 l-25 -6 -3 -10501 c-2 -9325 0 -10502 13 -10513 8 -7 15 -21 15 -31 0 -10 16 -33 35 -52 19 -19 35 -42 35 -51 0 -9 13 -29 29 -44 16 -15 31 -38 33 -52 3 -23 8 -25 60 -28 34 -2 61 -9 68 -17 7 -8 20 -15 30 -15 10 0 23 -7 30 -15 11 -13 2788 -15 24885 -15 22097 0 24874 2 24885 15 7 8 23 15 37 15 13 0 26 7 29 15 4 8 17 15 30 15 14 0 27 7 30 15 4 8 15 15 26 15 25 0 108 82 108 108 0 11 7 22 15 26 10 3 15 19 15 45 0 25 5 41 15 45 8 3 15 16 15 29 0 14 7 30 15 37 13 11 15 1186 15 10465 l0 10453 -31 26 c-17 14 -37 26 -45 26 -9 0 -14 11 -14 33 0 36 -15 57 -41 57 -9 0 -22 7 -29 15 -9 11 -32 15 -80 15 -51 0 -69 4 -74 15 -3 10 -19 15 -44 15 -23 0 -45 6 -52 15 -9 10 -32 15 -75 15 -43 0 -66 5 -75 15 -9 11 -32 15 -82 15 -52 0 -70 4 -74 15 -4 11 -21 15 -59 15 -34 0 -57 5 -65 15 -9 11 -32 15 -79 15 -54 0 -70 4 -84 20 -13 16 -29 20 -81 20 -44 0 -67 5 -76 15 -9 11 -32 15 -78 15 -50 0 -68 4 -78 18 -13 16 -15 16 -28 0 -17 -23 -108 -25 -126 -3 -7 8 -29 15 -50 15 -24 0 -40 5 -44 15 -4 11 -22 15 -74 15 -50 0 -73 4 -82 15 -9 11 -34 15 -97 15 -65 0 -85 3 -89 15 -5 12 -28 15 -124 15 -96 0 -119 3 -124 15 -4 12 -26 15 -104 15 -73 0 -103 4 -111 14 -8 10 -44 15 -125 17 -91 3 -118 8 -133 22 -16 14 -38 17 -115 17 -73 0 -99 4 -108 15 -10 11 -36 15 -110 15 -78 0 -99 3 -104 15 -4 12 -31 15 -156 15 -125 0 -152 3 -156 15 -5 12 -25 15 -94 15 -69 0 -89 3 -94 15 -4 12 -30 15 -140 15 -110 0 -135 3 -140 15 -4 12 -29 15 -134 15 -103 0 -132 3 -142 15 -10 12 -37 15 -125 15 -85 0 -115 3 -124 14 -9 11 -50 15 -177 18 -145 3 -167 5 -175 21 -9 15 -27 17 -143 17 -110 0 -135 3 -140 15 -4 12 -33 15 -169 15 -134 0 -167 3 -177 15 -10 12 -37 15 -125 15 -91 0 -114 3 -119 15 -4 12 -33 15 -169 15 -134 0 -167 3 -177 15 -10 12 -44 15 -185 15 -141 0 -175 3 -185 15 -10 12 -45 15 -192 15 -150 0 -180 2 -184 15 -5 12 -29 15 -125 15 -92 0 -120 3 -126 14 -6 12 -50 15 -229 18 -195 3 -224 5 -241 21 -16 14 -38 17 -115 17 -73 0 -99 4 -108 15 -10 13 -51 15 -250 15 -199 0 -240 2 -250 15 -10 12 -40 15 -155 15 -116 0 -145 3 -155 15 -12 14 -15 14 -30 0 -22 -20 -86 -20 -94 0 -4 13 -34 15 -184 15 -147 0 -182 3 -192 15 -10 12 -39 15 -140 15 -101 0 -130 3 -140 15 -11 13 -56 15 -295 15 -239 0 -284 2 -295 15 -10 12 -42 15 -170 15 -125 0 -160 3 -170 14 -9 12 -63 15 -299 18 -258 3 -289 5 -305 21 -15 14 -36 17 -131 17 -91 0 -114 3 -119 15 -5 13 -48 15 -309 15 -259 0 -306 2 -317 15 -10 12 -48 15 -220 15 -176 0 -209 2 -214 15 -5 13 -49 15 -311 15 -262 0 -306 2 -311 15 -5 13 -39 15 -219 15 -180 0 -214 2 -219 15 -5 13 -47 15 -296 15 -249 0 -291 2 -296 15 -5 13 -44 15 -265 15 -209 0 -260 3 -266 14 -6 11 -72 14 -338 18 -262 4 -335 7 -354 19 -18 11 -25 11 -28 2 -7 -18 -81 -16 -99 2 -12 12 -46 15 -173 15 -129 0 -161 3 -171 15 -10 13 -53 15 -265 15 -212 0 -255 2 -265 15 -11 13 -58 15 -315 15 -260 0 -304 2 -309 15 -5 13 -61 15 -421 15 -360 0 -416 2 -421 15 -5 13 -51 15 -324 15 -270 0 -319 2 -330 15 -11 13 -74 15 -457 15 -385 0 -444 2 -449 15 -5 13 -52 15 -339 15 -283 0 -334 2 -345 15 -11 13 -79 15 -500 15 -474 0 -487 1 -505 20 -18 19 -31 20 -520 20 -435 0 -504 2 -515 15 -11 13 -77 15 -485 15 -408 0 -474 2 -485 15 -7 8 -27 15 -45 15 -18 0 -38 -7 -45 -15 -18 -22 -137 -21 -162 1 -16 16 -18 16 -24 0 -9 -22 -119 -23 -128 -1 -5 13 -191 15 -1589 15 -1396 0 -1586 -2 -1597 -15 -9 -11 -34 -15 -95 -15 -61 0 -86 4 -95 15 -7 8 -20 15 -30 15 -10 0 -23 -7 -30 -15 -9 -11 -34 -15 -95 -15 -61 0 -86 4 -95 15 -7 8 -20 15 -30 15 -10 0 -23 -7 -30 -15z m3960 -130 c382 -8 776 -17 875 -20 99 -3 344 -10 545 -15 201 -6 565 -17 810 -25 245 -9 585 -20 755 -25 171 -6 351 -12 400 -15 50 -2 221 -9 380 -14 160 -5 373 -15 475 -20 102 -6 311 -16 465 -21 537 -20 741 -29 935 -40 107 -6 296 -15 420 -21 124 -5 315 -14 425 -19 110 -6 295 -14 410 -20 116 -5 343 -16 505 -25 162 -8 387 -19 500 -25 113 -5 237 -12 275 -15 65 -6 406 -24 820 -45 94 -4 213 -11 265 -15 52 -4 176 -11 275 -16 99 -5 221 -13 272 -19 50 -5 124 -10 165 -10 40 0 172 -7 293 -15 121 -8 373 -24 560 -35 187 -11 401 -25 475 -30 74 -6 243 -17 375 -26 532 -34 1039 -68 1305 -89 107 -8 267 -19 355 -25 88 -6 193 -15 233 -20 40 -6 109 -10 153 -10 58 0 85 -4 95 -15 12 -12 20 -12 36 -4 14 8 54 8 141 0 124 -11 420 -35 892 -71 143 -10 312 -24 375 -30 63 -6 174 -15 245 -21 72 -6 202 -17 290 -25 88 -8 216 -18 285 -24 69 -5 143 -12 165 -15 22 -3 114 -12 205 -20 271 -24 479 -43 590 -54 58 -5 182 -17 275 -25 94 -9 184 -18 200 -21 17 -2 122 -14 235 -25 113 -11 268 -27 345 -36 77 -8 208 -22 290 -30 83 -8 168 -16 190 -19 127 -17 283 -36 370 -45 55 -5 156 -17 225 -25 69 -9 184 -22 255 -31 72 -8 162 -19 200 -24 39 -5 108 -13 155 -19 47 -6 137 -17 200 -26 195 -28 331 -46 440 -60 100 -13 206 -29 405 -61 50 -8 125 -19 169 -24 43 -5 111 -16 150 -24 39 -8 134 -24 211 -36 77 -11 172 -27 210 -34 39 -8 99 -20 135 -26 36 -7 83 -16 105 -21 22 -4 74 -13 115 -19 41 -6 90 -16 107 -21 18 -6 54 -14 80 -19 27 -5 89 -18 138 -30 50 -11 110 -24 135 -29 25 -5 90 -21 144 -35 54 -14 114 -26 133 -26 25 0 32 -3 26 -12 -4 -7 -10 -4727 -13 -10488 l-5 -10475 -26 -55 c-27 -56 -90 -130 -111 -130 -6 0 -19 -6 -27 -14 -9 -7 -37 -18 -63 -25 -35 -8 -6315 -11 -24885 -11 -21270 0 -24844 2 -24883 14 -67 21 -106 43 -124 71 -9 14 -23 25 -31 25 -8 0 -15 8 -15 17 0 9 -8 25 -17 35 -10 11 -23 41 -30 66 -16 62 -19 20942 -3 20972 6 12 16 17 25 13 9 -3 35 -1 58 5 23 6 62 15 87 21 311 68 518 111 600 122 36 5 85 13 110 19 94 20 157 32 225 40 39 5 88 13 110 19 22 5 81 15 130 21 50 6 108 16 130 21 22 5 81 14 130 19 50 6 97 13 107 16 9 3 49 9 90 14 40 5 100 14 134 19 102 18 344 52 439 62 50 5 103 14 119 19 16 6 49 10 75 10 25 0 88 7 141 15 52 8 176 24 275 35 99 12 272 32 385 45 113 13 250 29 305 35 55 6 136 15 180 21 44 5 123 14 175 19 124 11 288 29 370 40 36 5 137 16 225 24 88 9 320 31 515 51 467 46 994 94 1150 105 69 5 166 14 215 19 117 13 300 30 445 41 63 5 196 16 295 25 99 8 263 22 365 30 237 18 538 42 620 50 168 15 1312 98 1590 115 80 5 161 12 180 15 19 3 107 10 195 15 88 5 228 14 310 20 718 47 1050 69 1320 85 138 9 351 22 475 30 124 8 275 17 335 20 61 3 220 12 355 20 441 26 774 45 855 50 367 20 631 35 800 44 110 6 279 15 375 21 96 6 272 15 390 20 118 5 447 21 730 35 723 36 869 42 1170 54 146 6 355 16 465 22 221 12 497 23 950 38 165 6 386 15 490 21 105 6 336 15 514 20 178 6 333 12 345 15 11 2 248 9 526 15 278 6 699 17 935 25 237 8 628 20 870 25 242 6 492 13 555 16 166 7 1094 26 1670 34 681 10 2085 2 2920 -15z"/>
        </g>
    </svg>
    Ответ написан
    2 комментария
  • Как правильно позиционировать элементы на flexbox?

    @Steppp
    <header></header>
    <div>
      <div class="navidation"></div >
      <main></main>
      <aside></aside>
    </div>
    <footer></footer>
    Ответ написан
    Комментировать