HTML Coding
Subforums
-
- 30.1k
- posts
-
- 1k
- posts
-
- Про макеты
- By klierik,
Explore Questions
There are no popular questions to show right now
-
0 votes0 answers
-
0 votes0 answers
-
0 votes0 answers
-
0 votes1 answer
-
0 votes3 answers
29542 questions in this forum
-
Горизонтальное выравнивание блочных элементов
Здравствуйте. Вот уже несколько лет верстаю разной степени сложности страницы и изучаю различные приемы и методы. Но до сих пор не нашел для себя действительно удобного, идеального метода выравнивания блочных элементов по горизонтали. О чем, собственно, речь. Есть какой-то макет с кучей элементов. И некоторые элементы надо расположить на одной линии по горизонтали, вписав в какой-нибудь фиксированный контейнер. Итак, какие есть способы сверстать такой "макет"? 1. Старые добрые таблицы. Думаю, не нужно объяснять, что "таблицы для табличных данных", и вообще, поддерживать более-менее сложный макет, сверстанный таблицами — очень муторно. 2. Способ классический. Использоват…
0 votes14 answers -
как разместить div по центру страницы
Собственно вопрос в теме, с IE я его решил, через хак, а вот чтоб на чистом css не получается, собственно, ниже код, из него все понятно <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Документы</title> <meta http-equiv="content-type" content="text/html; charset=windows-1251" /> <style> body{ width:100%; height:100%; margin:0; font : 12px Verdana; } #container{ position: relative; width:900px; min-height:228px; background-image:url(kepka.jpg); background-repeat:no-repeat; background-position: right…
0 votes2 answers -
Наложение div-ов с прозрачными картинка друг на друга
Билась над этой проблемой всю ночь, но работать корректно оно не хочет. Есть 3 дива: 1 с нижней большой картинкой, второй с прозрачной картинкой-закладкой поверх 1 и 3 див с текстом и фоном прозрачным, который тоже поверх большой картинки. Они нормально друг на друга накладываются, НО при этом под большой картинкой появляется отступ равный по высоте двум нижним дивам (хотя сами дивы висят на месте). Отсуп есть во всех браузерах, включая IE6. Вот код: HTML: ... <td valign='top'> <div id='actual5'> <img src='img/actual5.png' width='171' height='99' border='0' /> </div> <div id='big_main_foto' width='100%' height='315'…
0 votes4 answers -
Помогите с Оперой
Помогите пожалуйста кто чем может. В Опере постоянно вылазиет ошибки сначала при загрузке оперы выходит такое: При инициализации почты Opera возникла проблема. Ð�ижеÑ�ледующий файл, возможно, иÑ�пользуетÑ�Ñ� дÑ?угой пÑ?огÑ?аммой: C:\Documents and Settings\Общий\Local Settings\Application Data\Opera\Opera\mail\omailbase.dat ЗакÑ?ойте пÑ?иложение, его иÑ�пользующее, или пеÑ?езагÑ?узите Ñ�иÑ�тему, а затем повтоÑ?ите попытку. [b]А затем на кождой страничке, на которую я захожу выходит такое сообщение: Невозможно сохранить файл. C:\Documents and Settings\Общи…
0 votes14 answers -
Как сделать отступ?
Приветствую, помогите пожалуйтса, я только начал учить html, вот и столкнулся с проблемой, хочу сдвинуть таблицу немного вправо, только как я незнаю вот серую таблицу вправо немного, как ее сдвинуть?
0 votes4 answers -
Живой, движущийся задний фон сайта.
Есть задняя фоновая картика bg.jpg (фиксированая, при скролинге сайта остаеться на месте). Задумка следущая, нужно сделать так чтобы на этот bg.jpg ложилась и двигалась влево еще одна картика smoke.png (полупрозрачная). Поверх smoke.png, ложиться еще раз smoke.png, но уже движеться вправо. Smoke.png должны двигаться одновремено, каждая в своем направлении. А также чтобы при скролинге сайта они не прокручивались верх-вниз, а были тоже как бы завиксированы. В общем проще говоря нужно создать эффект движущегося дыма. Естественно скролинги картики smoke.png должены быть бесконечными (петлей) Как это можно реализовать ? Вот строка картинки заднего фона в моем CSS. Помогите…
0 votes7 answers -
Проблема с инсталляцией Apache.
Решил установить Apache. Скачал .msi файл с оффициального сайта. Но, программа не устанавливается. Запускаю инсталятор, окно установки появяется, исчезает на секунду и появляется тоже окно, со следующим сообщением: Installation Wizard Interrupted The installation wizard was interrupted before Apache HTTP Server 2.2.11 could be completely installed. Your system has not been modified. To complete installation at another time, please run setup again. Click finish to exit the wizard. И одна активная кнопка - "Finish". Перезапускал установку, скачивал другие версии, ничего не помогает, везде одно и тоже. Проверял антивирус, вроде не запрещает установку. Что делать, может у ко…
0 votes9 answers -
Вёрстка div высота 100% 3 колонки
Ситуация: 3 колонки: 1-фикс(пикселы), 3-резина в %, 2-всё, что осталось. Если содержимое колонок меньше высоты окна браузера, то фон колонок должен растягиваться до низу (на всю высоту окна браузера). И естественно при изменении высоты окна также растягивается или уменьшается. Если содержимое хотя бы одной колонки больше высоты окна, то все три колонки растягиваются(выравниваются) по высоте самой длинной (с появлением прокрутки). Задача: обойтись без JS, фона с использованием картинок (т.н. faux columns) и трюка с оочень большим padding-bottom и отрицательным margin-bottom. Помимо любого решения в данных условиях отдельно интересует возможность сделать это при помощи свой…
0 votes19 answers -
Картинка в Всплывающей подсказке
Прошу помощи! У меня такая проблема - необходимо что-бы всплывающая подсказка содержала картинку но проблема в том что необходимо это сделать в html в самом блоке где идет текст (блок прикручен как чистая страничка) посоветуйте код для воплощения этой задачи желательно не сильно громоздкий код потому как на страничке много картинок к которым нужно прикрутить всплывающую подсказку с изображением Или подскажите как к стандартной всплывающей подсказке title прикрутить изображение
0 votes7 answers -
выпадающее меню
Доброе время суток! Сделал выпадающее меню (html+css), но когда выпадает список, он прячется за фоновой картинкой контента. Как сделать что б меню было сверху? Все файлы залил на filestore index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Форсаж</title> <link rel="stylesheet" href="css/reset.css" type="text/css" media="screen"> <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"> </head> <body> <div class="main-bg"> <div class="bg"> <header> <div class="main"> <div class="wrapper"> <h1><a href="index.html"></a>&l…
0 votes9 answers -
Отступ Navbar Bootrstap
Доброго. Проблема с элементом Bootstrap, а именно navbar. При добавлении элемента появляется негативный отступ до дальнейшего контента страницы. Как его убрать? <nav class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-main" aria-expanded="false"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#"><img sr…
0 votes9 answers -
Хитрый position: fixed
Привет. Стоит задача разобраться, реализовать нечто подобное как у яндекс-музыки: http://music.yandex.ru/ Дизайн сайта представляет 4 блока: 1. верхний - шапка 233px; 2. меню под шапкой 30px; 3. контент height:100%; 4. подвал height:50px; Надо сделать div блок под меню сайта с фиксированным позиционированием, но что бы он прокручивался до top:0px; и в топе фиксировался при дальнейшей прокрутке (position:fixed;), а в случае если страничку прокручивают обратно вверх, то меню сдвигалось с поправкой на шапку, что то вроде (position:absolute; top:233px;) Всю голову сломал, выручите, кто в теме... Не обязательно так изворачиваться, возможно есть выход альтернативный, по типу m…
0 votes32 answers -
Поворот, вращение background
Поворот, вращение background, возможно ли это? Сама проблема: background всей страницы сделан как градиент, но под 45 град. Чтоб понятнее - вот сама картинка (5 кБ):
0 votes10 answers -
Тест на JavaScript
Нужно создать тест при помощи JavaScript, который выбирал бы вопрос случайным образом из отдельного файла (списка вопросов и ответов). Может кто-нибудь знает, где можно скачать готовый такой скрипт с генерацией случайных вопросов?
0 votes5 answers -
Не правильное отображение в Chrome
Здравствуйте. Первый раз столкнулся с ситуации, что в Хроме некорректно отображается страница, то есть в Мозилле, Опере и даже ИЕ всё ОК. а в Хроме нет... Ситуация следующая: <div id="wrapper"> <header id="header"> </div> <nav id="hor_menu"> </nav> </header> <header id="slider"> </header> <section id="middle"> <div id="container"> <div id="content"> </div> </div><!--#container--> <aside id="sideRight"> </aside> <aside id="sideLeft"> </aside> </section> </div><!-- #wrappe…
0 votes20 answers -
Как верстать в HTML 5?
Приветствую. Вот как я посмотрю много суеты вокруг этого новшества. Ну в общем у меня вопрос из сабжа. Ради расширения познаний хотелось услышать ответ. В чем отличается вёрстка того же xhtml от html5? ну к примеру я в одном проекте написал так: <!DOCTYPE html> <html> <head> и что теперь это можно назвать сайт свёрстанный в стиле html5? так как кроме этой строчки там, вроде как, ничего другого что касается html5 нету. собственно говорим о сабже
0 votes67 answers -
div Как перенести блок на новую строку
Вечер Добрый. Пишу с просьбой дабы объяснили как можно перенести блок в определенно место. Скрытый текст <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="./css/style.css"> <title>HTML5</title> </head> <body> <div class="" ="wrapper"> <div class="header"> <div class="header_line"></div> </div> <div class="row"> <div class="avatar"></div> <div clas="abme"> <div class="name"></div> <div class="status"><…
0 votes3 answers -
позиционирование картинки внизу страницы (div'ы)
Доброго времени суток )) Вопрос такой. Как на страничке с фиксиорованным дизайном, свертанной div'ами с позиционированием, сделать,чтобы картинка отображалась в самом низу страницы при любой длине страницы? Хелп, плиз, или "ткните носом", где почитать Заранее, спасибо ))
0 votes5 answers -
убрать перенос строки в списке.
Как убрать перенос строки в списке для создания горизонтального меню? <ul class="header_top_list"> <li>меню1</li> <li>меню2</li> <li>меню3</li> </ul> Результат: меню1 меню2 меню3 Нужный результат: меню1 меню2 меню3
0 votes13 answers -
Img Align=center
кто пояснит значение этого параметра, которого нет в доках сайта? IMG ALIGN=CENTER <p align="center"><img border="2" src="n.gif" width="120" height="40" align="center"> <img border="2" src="en.gif" width="120" height="40"> <img border="2" src="wn.gif" width="120" height="40" align="center"></p> вот код, что относительно чего выравнивается - не пойму, но красиво.
0 votes5 answers -
Блик на чистом css
Доброй ночи, уважаемые форумчане! Не подскажете, как создать такой блик исключительно на css. Просто вырезать и вставить блик как-то не круто( А других идей у меня пока нет... http://clip2net.com/s/3j79hmY
0 votes3 answers -
как убрать padding у div последнего элемента
Здравствуйте участники форума подскажите, как убрать padding у div последнего элемента исходные коды html, css прилагаю ниже <div class = "news-main"> <div class = "news"> <div> <img src = "img/article-img1.jpg" alt = "" /> <h3>Column title</h3> <p class = "preview"> Maecenas faucibus mollis interdum. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. </p> </div> </div> <div class = "news"> <div> <img src = "img/article-img2.jpg" alt = "" /> <h3>Column title</h3…
0 votes8 answers -
оформление select через css
Добрый вечер. Есть задача оформить выпадающий список при помощи css . Попробовал изменить немного оформление, но работает нормально только в Mozilla, остальные браузеры игнорируют стили, хотя надо изменить только background по :hover и применить padding. Применил такие правила: .s-t-select option{padding:4px 0 4px 10px;} .s-t-select option:hover{background-color:#9bb5c9; color:#fff;} Работает, повторюсь, только в Mozilla... Подскажите, пожалуйста, как решить данную задачу. В инете как вариант нашёл только плагины на jquery, но не хочется навешивать скрипты ради одного списка. Вот ссылка, список вначале страницы, "выбор по экватору" Вот так это выглядит в Mozilla...
0 votes6 answers -
FORM - передача параметров на e-mail
Хочу сделать у себя на сайте форму состоящую из тр?х полей. Чтобы информация занес?нная в эти поля попадала мне на E-mail. Подскажите, как сделать? Буду признателен. Сайт на народе.
0 votes22 answers -
Африканские шрифты
Есть у кого кириллические африканские шрифты наподобие тех, что приведены по ссылке? http://www.design-africa.com/fonts/african-fonts01.html
0 votes2 answers
-
Обсуждения
-
Актуальные контакты: 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-