Practise Templates
Templates for self education and practise
99 topics in this forum
-
- 1 reply
- 2.5k views
Допустим этот текст вписан в многострочное текстовое поле (textarea) Окно сжимается и хотелось бы, чтобы высота поля увеличивалась, а не как сейчас: Можно что-то сделать? Пробовал через https://github.com/javierjulio/textarea-autosize - ничего не вышло. Я на правильном пути?
Last reply by npofopr, -
- 1 reply
- 2.4k views
<html> <head> <style> button.knopka { color text: #000000; text-align: center; background: #F0F0F0; padding: 5px; border-radius: 13px; height: 31px; width: 260px; border: 2px solid #EF9BC7; } button.knopka:hover { background: #EF9BC7; } </style> </head> <body> <div class = "center"><button class="knopka"><b>Разное</b></button> </body> </html> увидел якобы можно сделать отцентровку текста в кнопке так <html>position: absolute; top: 50%; left: …
Last reply by Vic-Tor, -
- 1 reply
- 2.3k views
Как сделать , чтоб при уменьшении екрана , список не сжимался?Код https://jsfiddle.net/RedSniper/7nx6sf2v/3/ При 1920*1080 выглядит нормально, но при маштабировании +10 процентов сжимается и получается не красиво.Можно как-то его зафиксировать ,чтоб он не менялся до размеров телефона?
Last reply by klierik, -
- 1 reply
- 3.7k views
Появился вопрос на который я так и не смог найти ответа. Нужно создать регистрацию и авторизацию с базой данных и я не понимаю как подключить php файл к html? В остальном попытаюсь разобраться сам
Last reply by npofopr, -
- 1 reply
- 3.5k views
body { background: url(C:/Users/Desktop/33.jpg) repeat-x 0 100% fixed,linear-gradient(to top, #5080b1, #004e8c) fixed; } картинка не появляется на заднем плане.правилен ли код?
Last reply by npofopr, -
- 1 reply
- 2.5k views
Здравствуйте. Верстаю сайт, в валидаторе firefox выскакивает "parse error" в css для мобильных браузеров. По задумке <span class="phonecpu">текст</span> виден на десктопах, а на мобильных display:none его закрывает. При валидации стилей для медиа-запроса - parse error стиля .phonecpu. В чем может быть причина? <nav class="one"> <ul class="topnav"> <li><a class="activeone"href="#"><span class="icon-home"></span></a></li> <li><a href="#"class="active"><span class="icon-phone"> <span class="phonecpu">Вызвать мастера</span></span></a> <u…
Last reply by Xandr555, -
- 1 reply
- 3k views
Всем привет! Помогите пожалуйста решить проблему. На сайте размещены картинки и линии тега <hr>, все это заполнило видимую область страницы, но не появляется полоса прокрутки страницы, а мне необходимо опускать эти картинки ниже. Как быть?
Last reply by klierik, -
- 1 reply
- 3.1k views
Выполняю рабочий проект для заказчика Встал вопрос как сверстать секцию о нас(будет правильней чтобы верстка не поехала), так как она наслаивается на верхнюю секцию, плюс полупрозрачный border, плюс под ним еще и картинка И как совместить картинки с задними блоками на секции Продукция И еще такой момент, сталкивались ли вы с тем что картинки-исходники разного размера в исходниках, допустим в секции продукция картинка листовок сплющена, если сталкивались может быть подскажите как решать такие моменты. Буду рад конструктивным советам, спасибо Прикладываю макет https://www.figma.com/file/NpCXMgs0oIjLYfuiqzPTJ4/Типография?node-id=11%3A2
Last reply by Igor Schnaider, -
- 1 reply
- 2.5k views
Нужен сабж. От самых простых до саааамых сложных. С адаптивностью и без. Для самостоятельного обучения верстки.
Last reply by klierik, -
- 1 reply
- 1.4k views
Last reply by klierik, -
- 1 reply
- 1.8k views
Правильно ли будет сверстать блок из макета так, что блоку с картинкой и блоку с обратной связью нужно будет задавать фиксированную ширину и высоту? Или есть способ более правильный? Макет https://www.figma.com/file/zwa7oxqCS43WTsPEAQhMik/Форма-заказа?node-id=1%3A40
Last reply by Switch74, -
- 1 reply
- 1.5k views
добрый день всем, я начинающий верстальщик. Ищу макеты в основном в телеграме и верстаю их, н, ради интереса я решил забить один из макетов в гугл и обнаружил что существует сайт на этом макете, причем такой навороченный сайт. Стоит ли верстать такие макеты для портфолио ?
Last reply by klierik, -
- 0 replies
- 3k views
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Portfolio of Almas</title> <link rel="stylesheet" href="css/fonts.css" /> <link rel="stylesheet" href="css/style.css" /> </head> <body> <header class="header"> <nav> <ul class="menu"> <li><a href="#">About me</a></li> <li><a href="#">Portfolio</a></li> <li&g…
Last reply by almaskazhymurat, -
- 0 replies
- 2.6k views
Не могу настроить масштаб кнопки
Last reply by Den1s, -
- 0 replies
- 4.2k views
Прикольный сайт для верстки сайтов в интерактивном режиме devdesire.ru Для новичков прям отлично зайдет
Last reply by timurikvx, -
- 0 replies
- 1.7k views
Разбираюсь с прекрасным сервисом Гугл формы. Открыл для себя, что они могут работать прямо из тела письма. При этом они могут отправлять почту и им не нужны серверные скрипты. Возникла идея сделать интернет магазин прямо в теле письма. Клиент открывает письмо и никуда не переходит. У него в теле письма уже корзинка с товарами и несколько товаров. Это решает вопрос отсутствия сайта и хостинга, снимает вопрос приватности, такой магазин невозможно забанить или взломать. Вот пример такого статичного интернет магазина со скрытой гугл формой внутри http://heeg.ru/heeg5.1.zip в нем куча картинок для примера, но они могут встраиваться в сайт через base64 если просто перетащит…
Last reply by HEEG.HTML, -
- 0 replies
- 1.9k views
Всем привет. Собрал шаблон jsfiddle но знаю что сделал криво, прошу посоветовать как правильно такое реализовать, сейчас поведение блоков именно такое как нужно, просто думаю что реализовано неверно. На экранах компьютеров должно быть две колонки, левая с картинкой во всю высоту и примерно в половину ширины. В правой колонке текст. На мобильных устройствах, левая колонка поднимается в самый верх на всю ширину экрана, а ниже уже идет текстовый блок который был справа. Пытался сделать кросбраузерно но не получилось, у меня используется свойство background-size: cover которое ниже ие 9 не поддерживается. Пробовал картинку делать не бекграундом, а как обычное img…
Last reply by sadko007, -
Всем привет! Скиньте кто-нибудь psd макеты приютов для животных, вет.клиник и все что связано с данной тематикой. Нигде не нашел. Заранее СПАСИБО!!!
Last reply by tanat, -
- 0 replies
- 2.6k views
Здравствуйте, у меня вопрос может и юридический, нашёл несколько сайтов на которых авторы предлагают бесплатные шаблоны. У них у всех лицензия MIT, немного прочитав условия и документацию оказалось действительно что они бесплатны и можно их использовать в коммерческих целях. Хотел уточнить вы пользуетесь такими шаблонами? Или есть подводные камни? Пример 1 Пример 2 Пример 3
Last reply by Алексей777, -
- 0 replies
- 3.5k views
Всем привет! Подскажите, пожалуйста - как в блоге Wordpress сделать себе такие же карточки? Я пробовал Elementor, но что-то там ничего не вышло... В идеале был бы рад наводке на специальный плагин с настройками в админке, чтобы в этом белом боксе сразу указывать по необходимости и картинку, и текст, и ссылку в соотв. полях. Сайт, с которого взял пример, здесь (ссылку ставлю, т.к. может программный код на странице поможет разобраться, как это сделано).
Last reply by Vashenko, -
- 0 replies
- 3k views
Добрый день мне нужно что h1 был как на макете справа по центру (как на макете) max-width: 1920px; max-height: 1080px; И чтобы при изменения размера экрана положения заголовка и фона не менялись Исходники.rar
Last reply by Almaz_Kazan, -
Нужен наставник, интересует верстка, устал искать разрозненные знания в интернете. Естественно не бесплатно. Со своей стороны знаю где и как брать реальные заказы, (не про биржи фриланса). Уже работаю с заказчиками приходится использовать Addobe Muse, WordPress, параллельно работаю директологом. Ты научишь меня верстке. Если ты просто знаешь как верстать, и делаешь это хорошо и усидчиво, я помогу монетизировать тебе твои знания, а ты научишь меня верстке.
Last reply by РоманФ, -
- 0 replies
- 2.9k views
Собрал три блока в виде геометрических фигур - сверху и снизу треугольники в середине параллелогамм. И составил их в столбец, обернув все в общий блок. <div class="d4"> <div class="d1"></div> <div class="d5"></div> <div class="d3"></div> </div> Но в результате получилось, что расстояния между ними большие. Как состывать их вместе, нужно практически вплотную, максимум с отступом в 10 px. Использование padding и margin к желаемому результату не привело. Код CCS такой Треугольник сверху width: 0; height: 0; border-top: 100px solid #68B8AE; border-right:425px solid transparent; display:inline-block; …
Last reply by intman, -
- 0 replies
- 2.3k views
Всем привет! Пытаюсь сделать анимацию так, чтобы второй блок появлялся только после того, как первый полностью уйдёт влево. Ну просто никак, пыталась нагуглить, но получается только одновременное движение двух блоков. Может, кто-то опытный хотя бы намекнёт, что не так в моём коде? https://codepen.io/20ZeteM02/pen/WNwwEEp
Last reply by ZeteM,
-
Обсуждения
-
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ -
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ Портфолио https://www.behance.net/d4d4186e
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение. .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } } -
Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
-
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number">
-
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-