Сделать HTML Вёрстку не дорого
-
Similar Content
-
By Andy_Code
Здравствуйте! Проблема заключается в следующем: есть стартовый шаблон от "Фрилансера по жизни" версии 2021 года, открываю в VSCode, ввожу в терминале npm i затем gulp, все срабатывает как и должно, создается папка с результатом, начинаю прописывать стили для header, задаю ограничивающий контейнер и при проверке работоспособности данного контейнера выясняется, что стили, прописанные мной перекрывают стили медиа-запросов, прописанных в шаблоне и по итогу адаптив не работает, получается что итоговый css собирается в не правильном порядке! Подскажите, пожалуйста, как подобную проблему можно исправить?)
-
By vladdvin
Верстаю макет с Фигмы - https://www.figma.com/file/2rdy1qjBTl7D6BAC8S4qlf/Webovio?node-id=0%3A1. Наверстал
CSS
В результате отображается следующая картинка
в режиме инструментов разработчика. А вне режима вообще отображает
Подскажите как добиться отображения текста как на макете.
-
By RaiderCoder
Здравствуйте , сделал макет сайта для интернет магазина . Но столкнулся с проблемой при верстке кнопок на главной странице и не нашел информации как можно уместить текст + несколько картинок в одну кнопку. Знает кто решение и реалезуемо оно вообще ?
-
By dissamen2
Здравствуйте, столкнулся с такой проблемой, что в десктопной версии сайта все работает нормально, однако при переходе на мобильную, блок становится пустым и занимает гораздо меньше места, в чем проблема?
-
By Hinn
Всем приветик, начинающий фрилансер. Ищу первые заказы в данной сфере. Занимаюсь:
• На малом уровне версткой;
• Хорошо разбираюсь в таких CMS: как Wordpress и Tilta - легко и быстро разработаю одно страничные, многостраничные сайты, интернет-магазины (могу как дорабатывать, так и создания с нуля, так же занимаюсь переносом одного сервера на другой);
• Увлекаюсь разработкой логотипов (логотипы с нуля, доработка логотипа, рисование логотипа по эскизу).
Готов заниматься работой за любую плату. Так же присутствует портфолио, но за частую людям интересно когда о тебе есть отзывы. Поэтому пришел сюда за практическим опытом, и поиском постоянной работы.
Использую:
- Верстка: (HTML5/CSS3), верстаю из Figma, Photoshop, illustrator.
- Разработка сайта: (CMS WordPress, Tilta).
- Разработка логотипа: (Photoshop, illustrator)
Если не знаю чего-то необходимого для Вашего проекта\работы -- обязательно разберусь (все-таки начинающий фрилансер).
Если вы разработчик и вам некому спихнуть рутинную работу - я с радостью возьму её на себя;
телеграмм: HinnWork;
почта: [email protected]
Открыт для любых предложений.
-
-
Обсуждения
-
-
By Nicolyasic · Posted
Вот хороший пример "Рандомайзер слов из списка". Тут вместо дивов с картинками инпуты, но сути дела не меняет. Кроме того работает с разным кразмером списка (код универсальный). Если в сорсе код найдешь увидишь как работает — там 3 строчки с тем же Math.random. Если будут трудности пиши тут, я оповещение увижу кину тебе код оттуда + объясню шо как. Вообще прикольно так можешь посмотреть другие страницы на сайте, потренироваться с js (для начала как раз пойдет). Ну я вовремя конечно -
Пытаюсь динамически сформировать группу элементов <input type="checkbox"> Элементы создаются, но не получается задать им надпись, хотя раньше, создавая их вручную в HTML, всё получалось.. vk-groups-3.html vk-groups-1.html наладил.. vk-groups-3.html -
Вы отучились на бухгалтера или программиста? Почему спрашиваю. Я финансист, бухгалтер. Естественно, в свое время отучился на курсах 1С, но как экономист. Поэтому могу помочь с развитием именно в этом направлении, так как опыт огромный. -
Всем привет.Не так давно начал изучать верстку.И кароче захотел создать слайдер на основе html css без js. Застрял булеты работают и стрелки также но только стрелки становяться видимы когда первый раз нажал на булет.До этого их никак немогу настроить. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .wrapper{ width: 700px; height: 400px; margin:0 auto; border:5px solid green; border-radius: 20px; overflow: hidden; position: relative; } .container{ width: 600px; height: 300px; border: 5px solid green; border-radius: 20px; margin: 20px auto; } .slider__items{ display: none; } .bullets{ display: flex; position: absolute; left:100px; bottom:30px; } .bullets__items{ width: 50px; height: 15px; border:2px solid green; border-radius: 20px; background-color: lightgreen; margin: 0 20px; } .images{ display: flex; } .images__items{ width: 600px; height: 300px; border-radius: 20px; margin-right: 55px; } .arrows__prev{ background-image: url(./img/next.png); background-size: contain; width: 40px; height: 40px; position: absolute; top:150px; left: 2px; } #slide1:checked ~ .images .image1{ margin-left: 0; } #slide2:checked ~ .images .image2{ margin-left: -655px; } #slide3:checked ~ .images .image3{ margin-left: -1310px; } #slide4:checked ~ .images .image4{ margin-left: -1965px; } #slide5:checked ~ .images .image5{ margin-left: -2620px; } #slide1:checked ~ .arrow__next .img2, #slide2:checked ~ .arrow__next .img3, #slide3:checked ~ .arrow__next .img4, #slide4:checked ~ .arrow__next .img5, #slide5:checked ~ .arrow__next .img1{ display: block; background-image: url(./img/next.png); background-size: contain; width: 40px; height: 40px; position: absolute; top:150px; right: 2px; } #slide1:checked ~ .arrow__prev .img5, #slide2:checked ~ .arrow__prev .img1, #slide3:checked ~ .arrow__prev .img2, #slide4:checked ~ .arrow__prev .img3, #slide5:checked ~ .arrow__prev .img4 { display: block; background-image: url(./img/prev.png); background-size: contain; width: 40px; height: 40px; position: absolute; top:150px; left: 2px; } </style> </head> <body> <div class="wrapper"> <div class="container"> <div class="slider"> <input type="radio" name="slider" class="slider__items" id="slide1"> <input type="radio" name="slider" class="slider__items" id="slide2"> <input type="radio" name="slider" class="slider__items" id="slide3"> <input type="radio" name="slider" class="slider__items" id="slide4"> <input type="radio" name="slider" class="slider__items" id="slide5"> <div class="bullets"> <label for="slide1" class="bullets__items"></label> <label for="slide2" class="bullets__items"></label> <label for="slide3" class="bullets__items"></label> <label for="slide4" class="bullets__items"></label> <label for="slide5" class="bullets__items"></label> </div> <div class="arrow__next"> <label for="slide1" class="arrows__item img1"></label> <label for="slide2" class="arrows__item img2"></label> <label for="slide3" class="arrows__item img3"></label> <label for="slide4" class="arrows__item img4"></label> <label for="slide5" class="arrows__item img5"></label> </div> <div class="arrow__prev"> <label for="slide1" class="arrows__item img1"></label> <label for="slide2" class="arrows__item img2"></label> <label for="slide3" class="arrows__item img3"></label> <label for="slide4" class="arrows__item img4"></label> <label for="slide5" class="arrows__item img5"></label> </div> <div class="images"> <img src="./img/1.jpg" alt="" class="images__items image1"> <img src="./img/2.jpg" alt="" class="images__items image2"> <img src="./img/3.jpg" alt="" class="images__items image3"> <img src="./img/4.jpg" alt="" class="images__items image4"> <img src="./img/5.jpg" alt="" class="images__items image5"> </div> </div> </div> </div> </body> </html>
-
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.