Practise Templates
Templates for self education and practise
99 topics in this forum
-
- 1 reply
- 3.3k 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, -
- 7 replies
- 3.3k views
Не могу избавить от перекрытия textare-и картинки. Совсем новичок в верстке.
Last reply by DisplayName, -
В макете, созданном блочной версткой, две колонки (левая с меню, правая с текстом), хедер и футер. Условия задания: Левая колонка фиксированной ширины, правая резиновая. Футер нельзя прижимать к низу экрана. При широком окне браузера колонка с меню должна быть больше по высоте чем правая колонка. Подвал должен располагаться сразу после текста любой из колонок, смотря что длиннее. Проблема: Футер наезжает на колонку с меню при широком экране. Пробовала воспользоваться padding-bottom для блока с колонками, но тогда не выполняется последнее условие: при более узком экране между подвалом и текстом остается расстояние. П…
Last reply by lizaveta, -
- 4 replies
- 3.2k views
Подскажите пожалуйста, была написана landing page, достаточно давно, и сегодня заметил что пропала картинка. Раньше все было ок, а сегодня она пропала, и на самом сайте, и собственно на компьютере если запустить тоже ее нету. Что такое могло произойти? Код примерно такой. <header class="header"> .... </header> .intro{ background-image: url("../img/header_bg.png") center no-repeat/cover; height: 400px; background-size: 97% auto; }
Last reply by oleg126, -
- 5 replies
- 3.2k views
Помогите пожалуйста форумчане! Код отображается в браузере правильно (наверное), а в phplist не хочет отправляться( Програмист сказал,что много хлама, но я его не могу найти Новый текстовый документ (2).txt
Last reply by klierik, -
- 19 replies
- 3.2k views
Здравствуйте целую неделю сижу над этим у меня на сайте страница, на которую я добавляю ячейки, когда я вставляю <table> то ячейки автоматом срастаются с фоном страницы как сделать чтобы они не имели ни чего общего с фоном ? За ранее благодарен.
Last reply by lorddipo, -
- 4 replies
- 3.1k views
Всем привет! Прошу помощи. Какие есть варианты по реализации? Я использовала fieldset с вложенным legend и css rotate, но думаю этот способ не очень. В итоге получилось на половину, и текст с LERN MORE добавить не получилось(второй тег legend не учитывается)
Last reply by alanreid, -
- 2 replies
- 3k views
Возникала такая проблема блок banner выходит за пределы родителя header(он должен занимать весь экран) Подскажите как сделать так чтобы картинка в блоке banner занимала оставшуюся часть экрана и не вылазила за пределы <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="asecs/css/style.css"> <title>Five Stars Room</title> <link rel="preconnect" href="https://fonts.gstatic.com"> </head> <body> <header> <div class="container"> <div class="top-bar"> <h1>Logo</h1> </div>…
Last reply by rustamXx, -
- 0 replies
- 2.9k views
Добрый день мне нужно что h1 был как на макете справа по центру (как на макете) max-width: 1920px; max-height: 1080px; И чтобы при изменения размера экрана положения заголовка и фона не менялись Исходники.rar
Last reply by Almaz_Kazan, -
Нужен наставник, интересует верстка, устал искать разрозненные знания в интернете. Естественно не бесплатно. Со своей стороны знаю где и как брать реальные заказы, (не про биржи фриланса). Уже работаю с заказчиками приходится использовать Addobe Muse, WordPress, параллельно работаю директологом. Ты научишь меня верстке. Если ты просто знаешь как верстать, и делаешь это хорошо и усидчиво, я помогу монетизировать тебе твои знания, а ты научишь меня верстке.
Last reply by РоманФ, -
- 1 reply
- 2.8k views
Всем привет! Помогите пожалуйста решить проблему. На сайте размещены картинки и линии тега <hr>, все это заполнило видимую область страницы, но не появляется полоса прокрутки страницы, а мне необходимо опускать эти картинки ниже. Как быть?
Last reply by klierik, -
- 0 replies
- 2.8k 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, -
- 1 reply
- 2.8k views
Выполняю рабочий проект для заказчика Встал вопрос как сверстать секцию о нас(будет правильней чтобы верстка не поехала), так как она наслаивается на верхнюю секцию, плюс полупрозрачный border, плюс под ним еще и картинка И как совместить картинки с задними блоками на секции Продукция И еще такой момент, сталкивались ли вы с тем что картинки-исходники разного размера в исходниках, допустим в секции продукция картинка листовок сплющена, если сталкивались может быть подскажите как решать такие моменты. Буду рад конструктивным советам, спасибо Прикладываю макет https://www.figma.com/file/NpCXMgs0oIjLYfuiqzPTJ4/Типография?node-id=11%3A2
Last reply by Igor Schnaider, -
- 0 replies
- 2.8k 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, -
- 1 reply
- 2.7k views
Буду рад на критику и советы, что не так делаю? - https://codepen.io/viliksar/pen/zawdGK?editors=1100
Last reply by Filimon, -
Переношу сайт на ворд пресс. И возникла трудность, не могу найти скрипт который отвечает за кнопку спойлера РАСКРЫТЬ. Целиком код копирую с question.html, но не работает
Last reply by Николя223, -
- 0 replies
- 2.5k views
Здравствуйте, у меня вопрос может и юридический, нашёл несколько сайтов на которых авторы предлагают бесплатные шаблоны. У них у всех лицензия MIT, немного прочитав условия и документацию оказалось действительно что они бесплатны и можно их использовать в коммерческих целях. Хотел уточнить вы пользуетесь такими шаблонами? Или есть подводные камни? Пример 1 Пример 2 Пример 3
Last reply by Алексей777, -
- 3 replies
- 2.5k views
Привет всем. Делаю менюшку. Есть такая идея. чтобы при наведении на видимы блок срабатывал :hover и появлялся скрытый блок. (Типа выпадающего меню) Все вроде логично, но не работает... Подскажите пожалуйста, что я делаю не так. Код такой: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Имя</title> <style> .div1{ border: 4px solid black; width: 200px; } .div2{ display: none; } .div1:hover .div2{ display: block; border: 4px solid black; width: 200px; } </style> </head> <body> <div class="div1"> Меню </div> <div class="div2">Фрукты </div> </body> …
Last reply by klierik, -
- 2 replies
- 2.5k views
Возникла такая проблема. Необходимо ввести данные, а затем вывести эти данные в модальном окне, выскакивающее на этой же странице, никакой обработки. Можно ли как то использовать имя или id форм, чтобы потом их вывести в окне? Желательно без использования php и js, т.к. я их ещё не знаю. К примеру: ввёл я логин и пароль и в модальном окне мне высветилось: "Ваш логин: хххх, ваш пароль: хххх" Использую boostrap для модального окна.
Last reply by M33L, -
- 0 replies
- 2.5k views
Не могу настроить масштаб кнопки
Last reply by Den1s, -
- 13 replies
- 2.5k views
Всем привет, столкнулся с проблемой: у меня в css прописано: * { margin: 0; padding: 0; } body { font-family: "MyriadPro"; font-size: 14px; } .content-bottom { font-size: 40px; font-weight: bold; background-color: #ccc; } Подскажите, как убрать верхний и нижний отступ у текста.. Заранее спасибо!
Last reply by Launder, -
- 3 replies
- 2.4k views
Подскажите, как разместить 3 картинки в ряд , текст чтобы был под каждой как в примере (текст в несколько строк). Если можно пришлите , пожалуйста, аналогичный код
Last reply by npofopr, -
- 1 reply
- 2.4k views
Допустим этот текст вписан в многострочное текстовое поле (textarea) Окно сжимается и хотелось бы, чтобы высота поля увеличивалась, а не как сейчас: Можно что-то сделать? Пробовал через https://github.com/javierjulio/textarea-autosize - ничего не вышло. Я на правильном пути?
Last reply by npofopr, -
- 3 replies
- 2.4k views
Не мог бы кто-нибудь пожалуйста кинуть код вот такого маленького макетика из 2-ух div блоков. Спасибо!
Last reply by radioactive, -
- 1 reply
- 2.4k 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,
-
Обсуждения
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть. -
Решение нашел. Заменил на Всем привет. Список выходит из дива. При этом, другие элементы в диве отображаются корректно. Не могу найти причину. Нужно чтобы список был под кнопкой ПЛЕЙ... -
Здравствуйте! Мы команда программистов с многолетним опытом разработки. Работая с нашей командой, Вы получаете порядок условий и развитие с обеих сторон: разработка проекта и продолжение сотрудничества на долгосрочной основе, так же специалисты всегда готовы предложить различные идеи и дополнения. Разрабатываем проекты любой сложности: скрипты для автоматизации рутины, боты, сайты, админ панели, ico, ldo, разработка криптовалюты, смарт контракты, приложения, игры. Ответственность, качество, соблюдение дедлайнов - это про нас! Наш контакт: https://t.me/MadFury (https://t.me/madfury) (TG) TG: https://t.me/2e7.io Сайт: https://code-r.io/
-