Contests
40 topics in this forum
-
- 20 replies
- 13.1k views
С 4 по 9 августа 2011 года на форуме пройдёт небольшой конкурс по HTML5 Canvas. Конкурс рассчитан на новичков, для выполнения задания необходимо владеть начальными навыками по JavaScript и API Canvas. Правила мини-конкурса В конкурсе имеет право принять участие любой желающий зарегистрированный на форуме. Предварительная регистрация или заявка на конкурс не требуется. Начало конкурса 4 августа в 1:00 UTC (4 утра Киева, Минска, 5 Москвы, 7 Екатеринбурга, 8 Омска, 9 Красноярска, 10 Иркутска, 11 Якутска). Работы принимаются до 10:00 UTC 9 августа (13 часов Киева, Минска, 14 Москвы, 16 Екатеринбурга, 17 Омска, 18 Красноярска, 19 Иркутска, 20 Якутска). Участник должен сделат…
Last reply by Vlad, -
- 19 replies
- 16.9k views
Задание 1. Эскиз Уголки фиксированного размера, ширина и высота уголков одинакова, задаётся в пикселах. Задание 2. Блок с тенью Содержит скругления в заголовке и внизу блока. Вокруг блока тёмно-зелёная рамка и тень. Длина заголовка может меняться, соответственно, должна изменяться и ширина блока под ним, но при этом не превышать 250px. Задание 3. Блок с градиентом Полупрозрачная градиентная рамка вокруг блока с градиентным фоном под заголовком и небольшим треугольником. Фон на странице приведён лишь для наглядности эффекта полупрозрачности. Вы можете указать свою картинку или использовать ту, что в примере по адресу http://htmlbook.ru/example/images/redline.png Минима…
Last reply by Vlad, -
- 18 replies
- 6.6k views
Первые три места по итогам голосования распределились так. 1. exessqd1 2. Verder 3. s0rr0w Эти участники получают книги по их выбору. Заходите на books.ru, выбираете книгу, мне сообщаете ссылку, адрес доставки и фио. Все участники получают +30 к репутации, у кого меньше 30 сообщений переведены в группу Пользователей, плюс медалька всем выдана.
Last reply by tuch, -
- 17 replies
- 12k views
К Хэллоуину сделать изображение произвольного монстра с помощью свойств CSS3, при соблюдении ряда условий. Минимальный размер картинки 400х400 пикселов. В процессе работы нельзя использовать любые картинки (включая base64), SVG, VML, Canvas, скрипты, библиотеки и тому подобное. Фактически должен быть только HTML и CSS. Работа должна корректно отображаться в современных браузерах Firefox, Chrome, IE10. Свойства с вендорными префиксами для простоты не пишем (всё, что начинается на -moz, -webkit, -ms). Анимацию не используем. За основу разрешается брать любую готовую картинку и делать изображение по ней. Разрешается выкладывать несколько работ. Пример работы можно посмотрет…
Last reply by nfsworld, -
- 16 replies
- 5.5k views
Сделать дизайн приведённой формы (файл form.html). В процессе работы можно использовать любые изображения, менять положение элементов, редактировать поясняющий текст, а также производить манипуляции, направленные на повышение удобства формы. К примеру, такими манипуляциями можно считать замену флажков на переключатели. Текст внутри списков, рядом с флажками и переключателями формируется программно и изменению не подлежит, остальной текст можно менять по своему усмотрению. Работа должна быть представлена в виде изображения в формате PNG-24 или PSD. Если предполагается применение вкладок или других средств, которые скрывают часть формы, тогда следует сделать несколько изобр…
Last reply by Vlad, -
Предлагаю возродить практику мини-конкурсов на форуме, посвящённым разным веб-технологиям. С меня призы (книги, в основном), с вас - идея, что можно сделать. Например, к хэллоуину "нарисовать" на CSS3 монстриков. Вот симпатичный пример. http://media.smashingmagazine.com/wp-content/uploads/uploader/images/css3-designs/css3-monsters-dragon/
Last reply by Vlad, -
-
- 14 replies
- 7.3k views
Моя первая работа. http://jsfiddle.net/...mbedded/result/ Моя вторая работа. http://jsfiddle.net/...mbedded/result/ Бонус. http://jsfiddle.net/...mbedded/result/
Last reply by illya_v, -
- 14 replies
- 7.5k views
Здесь публикуются анимированные открытки для мини-конкурса Новогодняя открытка. Приём работ начинается с 1 декабря и завершается 15 декабря в 10:00 UTC (13 часов Киева, Минска; 14 Москвы; 16 Екатеринбурга; 17 Омска; 18 Красноярска; 19 Иркутска; 20 Якутска).
Last reply by ESSqS, -
- 13 replies
- 19.8k views
Необходимо составить задачу на практические знания CSS3 и привести её решение. Все присланные задачи публикуются в специальном разделе сайта htmlbook (http://htmlbook.ru/practical) с указанием автора и ссылки на его сайт. При написании задачи придерживайтесь следующих рекомендаций: задача должна решаться без дополнительных скриптов, только с помощью HTML и CSS;задача должна быть комплексной и задействовать разные приёмы и стилевые свойства;следует привести своё решение задачи, желательно с комментариями и пояснениями.задача не должна быть слишком сложной и требовать много времени на её решение. Таким образом, целые страницы или сложные формы для вёрстки не годятся.Результ…
Last reply by SelenIT, -
- 13 replies
- 6.2k views
Здесь публикуются работы для мини-конкурса Рожицы. Приём работ завершается 8 сентября в 10:00 UTC (13 часов Киева, Минска; 14 Москвы; 16 Екатеринбурга; 17 Омска; 18 Красноярска; 19 Иркутска; 20 Якутска; 21 Владивостока). После этого тема закрывается и новые сообщения не добавляются.
Last reply by Jack_V, -
- 13 replies
- 10.3k views
mrnobodyhttps://jsfiddle.net/mrnobody/97bhryg7/2/embedded/result/ https://jsfiddle.net/mrnobody/4vvwt9mt/1/embedded/result/ anonimaccounthttps://jsfiddle.net/anonimaccount/gjxzum53/3/embedded/result/ Senseihttp://jsfiddle.net/j0puz083/ Crystal-3http://jsfiddle.net/Lbcu90bc/2/ I.Phttp://codepen.io/badcode/full/KdKjBG kattiperkhttps://jsfiddle.net/kattiperk/gxbpwrw8/embedded/result/ amelicehttp://codepen.io/amelice/full/vNEpyJ/ treanhttps://jsfiddle.net/trean/07sgwqgq/13/embedded/result/ orainnnhttp://codepen.io/pena/pen/OyPrNQ?editors=110 http://codepen.io/pena/pen/jbEJBa?editors=110 OlgaVRhttp://jsfiddle.net/OlgaVR/7k8yL6s0/ https://jsfiddle.net/OlgaVR/z3gt7kty/ vinnyhttp…
Last reply by Vlad, -
- 11 replies
- 23k views
Друзья, всех с наступающим Новым годом! Поднимем себе настроение выбрав понравившуюся анимированную открытку и его автора. 1. iKNG http://jsfiddle.net/iKNG/ahean/embedded/result/ 2. nfsworld http://jsfiddle.net/qb39A/embedded/result/ http://jsfiddle.net/FY8zf/embedded/result/ http://jsfiddle.net/rHgYT/embedded/result/ 3. vinny http://jsfiddle.net/6TRfn/1/embedded/result/ 4. rpmcmerphy http://jsfiddle.net/rpmcmerphy/ZfzvF/embedded/result/ 5. Andrey-009 http://free-sait.ru/otkr/ 6. Zhannet http://jsfiddle.net/Zhannet/R8sNn/embedded/result/ 7. memed http://jsfiddle.net/memed/snuu2/embedded/result/ 8. illya_v http://jsfiddle.net/illya_v/vGn2z/embedded/result/ …
Last reply by Vlad, -
- 9 replies
- 5.8k views
Сюда выкладываем свои решения в виде ссылок на макеты. Желательно макеты выложить в свободный доступ, чтобы их можно было смотреть сразу, а не делать их в виде архиве для скачивания. У таких работ шансы на победу резко уменьшаются. Ссылки вставляйте между кодами [ hide ] и [ /hide ] пишутся они без пробелов.
Last reply by exessqd1, -
- 9 replies
- 23.1k views
Необходимо нарисовать анимированную рожицу пользуясь только средствами CSS при соблюдении ряда условий. Размер картинки 200х200 пикселей. Картинка не должна выходить за область 320х320 пикселей. Обязательно использовать анимацию. В процессе работы нельзя использовать любые картинки (включая base64), SVG, VML, Canvas, скрипты, библиотеки и тому подобное. Фактически должен быть только HTML и CSS. Разрешается выкладывать до трёх работ, объединяя их в одном посте или фидле. Примеры работ можно посмотреть здесь. http://bennettfeely.com/csscreatures/ За основу можно взять этот код: http://jsfiddle.net/wrk8Lu4w/ Результат выставляем на сайт jsfiddle.net и публикуем его в …
Last reply by Vlad, -
- 0 replies
- 3.4k views
Сюда можно выкладывать ссылки на решение задачи про скроллбар, описанной в этой теме
Last reply by s0rr0w,
-
Обсуждения
-
Актуальные контакты: 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-