frontend-coder
/ 1 вариант портфолио работ
Last active
July 17, 2019 06:08
верстка блока портфолио со сплывающим попапом с увеличенным изображением #css #html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML | |
| <!-- начало первого блока портфолио--> | |
| <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4"> | |
| <div class="portfolio"> | |
| <img src="images/Freelance.jpg" alt=""> | |
| <div class="portfolio-block"> | |
| <a href="#" class="portfolio-item"> <i class="fa fa-search-plus" aria-hidden="true"></i> | |
| <!--пытаюсь сделать всплывающее окно галеры --> |
frontend-coder
/ V1. Простая форма обратной связи
Last active
May 30, 2022 15:38
Форма обратной связи с Аякс, #validate
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML | |
| <!-- начало формы обратной связи --> | |
| <form class="forms-call"> | |
| <label> | |
| <input type="text" name="name" placeholder="Введите Ваше имя" required> | |
| </label> | |
| <label> | |
| <input type="text" name="phone" placeholder="Введите номер Вашего телефона" required> | |
| </label> |
frontend-coder
/ Как прижать блок к низу
Last active
July 17, 2019 06:53
Прижимаю контейнер к низу браузера #css #html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML | |
| <div id="container"> | |
| <div id="header"> | |
| <!-- Содержимое шапки --> | |
| </div> | |
| <div id="body"> | |
| <!-- Содержимое центральной части --> | |
| </div> | |
| <div id="footer"> | |
| <!-- Содержимое нижнего блока --> |
frontend-coder
/ №1. Фото с эфектом при hover
Last active
February 21, 2020 20:57
Простой эффект, при наведении курсора на фото она затеняется #hovercss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML | |
| <div class="portfolio"> | |
| <img src="img/Athena.jpg" alt=""> | |
| </div> | |
| CSS | |
| .portfolio{ | |
| margin: 0; | |
| padding: 0; | |
| position: relative; |
frontend-coder
/ Mouse animate icon
Last active
February 21, 2020 20:59
Mouse Wheel Animation CSS Icon #animation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML | |
| <div class="mouse-icon"><div class="wheel"></div></div> | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| HTML: | |
| <div class="wrapper"> | |
| <div class="tabs"> | |
| <span class="tab">Вкладка 1</span> | |
| <span class="tab">Вкладка 2</span> | |
| <span class="tab">Вкладка 3</span> | |
| </div> | |
| <div class="tab_content"> | |
| <div class="tab_item">Содержимое 1</div> | |
| <div class="tab_item">Содержимое 2</div> |
frontend-coder
/ style.css
Last active
July 17, 2019 07:23
В прозрачном окне с непрозрачным текстом размещена картинка, которое слайдится быстрее, чем вся страница #css #html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .main-name { | |
| background-color: transparent; | |
| height: 280px; | |
| position: relative; | |
| } | |
| .fixed-fon { | |
| background: url(../img/slide_box.jpg) top center no-repeat; | |
| -webkit-background-size: cover; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- jQuery --> | |
| $(".toggle-mnu").click(function() { | |
| $(this).toggleClass("on"); | |
| $(".main-mnu").slideToggle(); | |
| return false; | |
| }); |
frontend-coder
/ множественный фон контейнера
Last active
July 17, 2019 07:31
Как сделать множественный фон контейнера #css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .block-fon5 { | |
| background: | |
| url('../images/cherry.png') no-repeat 85% 80%, | |
| url('../images/mouse.png') no-repeat left top, | |
| url('../images/5JjnJ8bUnP.png') no-repeat center center, | |
| url('../images/css-karkas.png') no-repeat; | |
| -webkit-background-size: 100px 100px, auto, 50px 50px, auto; | |
| background-size: 100px 100px, auto, 50px 50px, auto; | |
| } |
frontend-coder
/ Создание ссылок в документе
Last active
September 13, 2023 17:19
Как вставить ссылки в документ html #links
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <a href="tel: +74951234567">+7 (495) 123-45-67</a> | |
| <a href="mailto: example@mail.ru">example@mail.ru</a> | |
| <a href="skype: someskype?call">someskype</a> | |
| <a href="skype:SkypeUser">someskype</a> | |
| <a href="#metka">анкор</a> jn place <a name="metka"></a> | |
| <a href="whatsapp://send?phone=79xxxxxxxxx"> | |
| <a href="viber://add?number=номер телефона"> | |
| <a href="tg://resolve?domain=имя"> |
OlderNewer