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
-
Div с ul с li
Вот у меня блок и в нем меню ul с li. При этом у главного блока border:8px solid #000000; и хотелось бы сделать так, при наведении курсором на ссылку текст становится цветом белым,а её фон чёрный, при этом фон касается краев главного блока.Никак не получается.Помогите пожалауйста. <div class='wrapper_mir' id='mir'> <ul class='wrapper_ul'> <li><a href='message.php' >1</a></li> <li><a href='.php' >2</a></li> <li><a href='.php'>3</a></li> <li&g…
0 votes26 answers -
id и class одновременно
Всем хорошего дня.Вопрос скорее всего глупый , только явного ответа на него в гугле я не нашел. Подскажите пожалуйста ,правильна ли запись вида <p id="main_text" class="main_text">Text</p> где id , я оставляю для движка (программиста) и вообще его не трогаю в стилях ,в CSS же пользуюсь только классами ?
0 votes13 answers -
Заменяющиеся картинки
Хочу сделать такую хрень: есть меню, берём в пример раздел "Новости", там картинка "Новости".png Как прописать в ЦСС так, чтобы при наведение на эту картинку появлялась другая? Знаю, a:link, a:visited { background-image: url('image1.gif'); } a:active, a:hover { background-image: url('image2.gif'); } только как это "умно" применить? Например: <div id="news"><a href="index.php?case=news"><img src="i/news.png" /></a></div> к нему цсс: #news { a:link, a:visited { background-image: url('news1.png'); } a:active, a:hover { background-image: url('news2.png'); } } Так у меня ЕСТЕССТВЕННО не пашет)) Объясните дураку как надо))
0 votes12 answers -
Слой в ячейке таблицы
Народ подскажите как можно сделать так чтобы слой расположенный в ячейке таблицы был расположен выше этой ячейки на заданное расстояние и наезжал на другую ячейку расположенную выше. В общем надо на сайт, сверстанный таблицами сверху слоем прилепить картинку, если указать относительное позиционирование , то ячейка разъезжается.
0 votes4 answers -
position: fixed + margin
Здравствуйте. Уж очень давно пытаюсь разобраться с одной вещью - взаимоотношениями position:fixed и margin:auto Ситуация такая: нужно чтобы был неподвижный при прокрутке блок, при этом чтобы он всегда находился по центру вне зависимости от разрешения экрана. Вот блок, сейчас вот бьюсь с кнопкой "Наверх" Стрелкой показано куда нужно сместить блок, css привязанный к блоку такой: #upButton{ position:fixed; margin:auto; bottom:0px; background: #b1b1b1; color: #ffffff; width:100px; height:30px; font: 14pt Calibri; box-shadow: 0 0 10px rgba(0,0,0,0.5); } Смог добиться такого результата только вложив блок который должен быть по середине в другой блок, результат вот: Css и Htm…
0 votes2 answers -
Форма обратной связи
Здравствуйте. Что нужно дописать, написать, чтобы при нажатии на кнопку "ОТПРАВИТЬ" улетало письмо на заданный e-mail? Форма задана как есть сейчас на сайте. Это основной вопрос. <h2 class="pad_bot1">Оставьте заявку на обслуживание</h2> <form id="ContactForm"> <div> <div class="wrapper"><div class="bg"><input class="input" type="text" value="Имя:" onblur="if(this.value=='') this.value='Имя:'" onfocus="if(this.value =='Имя:' ) this.value=''" ></div></div> <div class="wrapper"><div class="bg"><input class="input" type="text" value="E-mail:" onblur="if(this.value=='…
0 votes10 answers -
свойство 'right': IE и FF
есть такая разметка страницы <html> <head> <style type="text/css"> body { background-color: #FFFFFF; } #header_div, #links_div { position: absolute; display: block; } #header_div { font-family: Helvetica; color: #990000; font-size: 18pt; height: 80px; right: 10px; left: 10px; top: 10px; } #links_div { left: 10px; right: 10px; top: 100px; text-align: right; background-color: #FFE0E5; } #menu_div, #main_div, #right_div { position: absolute; display: inline-block; } #body_div { display: block; position: absolute; top: 150px; left: 10px; right: 10px; } #menu_div { width: 200px; left: 0px; top: 0px; position: relative; } #…
0 votes6 answers -
Моя первая страница на слоях
Всё время верстал на таблицах. Но решил попробовать новый сайт слепить на слоях. Задача: - Сайт тянется и в ширину и высоту - Шапка и подвал заданной высоты - Основная часть из двух колонок - Левая колонка заданной ширины, правая по ширине тянется - Если в одной из средних частей содержимое не влазит, то в ней должна появляться прокрутка Я понимаю, что для тех, кто привык верстать слоями это, наверное, просто. Но ожидал, что если получится, то будет какое-то извращение, которое если и будет работать, то мне его работу будет не понять. Однако получилось довольно просто. Однако хотелось бы чтобы знатоки глянули на мое творение на предмет возможных косяков или возможных по…
0 votes4 answers -
Выравнивание виджета «Мне нравится» от Вконтакте
Всем привет. Пытаюсь встроить виджет «Мне нравится» от Вконтакте к себе на сайт. В принципе, просто вставить его на сайт не проблема, однако у меня возникли проблемы с выравниванием этого виджета по центру какого-нибудь элемента. В начале я пытался выровнять его внутри <td> и/или <div> элементов, но когда совсем зашёл в тупик попытался просто сверстать обычную таблицу на всю страницу с выравниванием по центру и, очень удивился, когда просто вставленный код виджета отображается по вертикальному центру нормально, но сдвигается в сторону относительно горизонтального центра. Был бы очень благодарен за помощь в таком, казалось бы, не самом сложном вопросе. Сам, до …
0 votes3 answers -
Селекторы
Здравствуйте. есть к примеру элемент <div class="foo"></div> В чем разница между селекторами .foo и div.foo ?
0 votes20 answers -
Не растягивается контент в ie
Помогите разобраться почему в ie7 не хочет растягиваться стиль с контентом? хотя в FF все ок http://www.askplumbers.co.uk/index.php?opt...4&Itemid=23
0 votes14 answers -
Прикленный к нижней границе окна футер остается на месте при скроллинге
Приветствую. Помоги пожалуйста разобраться со следующей проблемой. Есть страничка с центральным позиционированием div размером 980px. Внизу поставил div по ширине окна, "приклеил его" к нижнему краю браузера, по методике, описанной на многих ресурсах. Но есть проблема. При скроллинге, как "прикленный" футер первоначально встал, так он и скроллится, одновременно с содержимым. Причем если потянуть за нижний край окна, футер стоит у нижнего края постоянно. Как сделать так, чтобы футер "приклеился" к нижнему краю окна и оставался там, при скроллинге? Если, по каким-то причинам это невозможно, как сделать этот же div, по всей ширине окна, но чтобы он встал…
0 votes8 answers -
Высота дива в %
Div идет как подлжка (т.е. без контента). В пикселах рисуется, в % - нет.
0 votes7 answers -
Как сделать, чтобы таблица растягивала body
<!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" xml:lang="ru" lang="ru" dir="ltr"> <head> <title>таблица</title> <style> html, body { width: 100%; margin: 0; padding: 0; } body { border: 1px solid green; } table td { border: 1px solid blue; width: 100%; margin: 0 0 0 auto; } </style> </head> <body> <table> <tr> <td>333333333333333333333333333333333333333333</td> <td>1111111111111111111111111111111111111111111111111111111111111111111</td> <td>22222222…
0 votes14 answers -
Мультиязычный сайт
Здравствуйте, как можно сделать сайт с несколькими языками. Мне надо rus и eng. Например есть 2 файла index.html один на русском, другой на английском. Надо чтобы с одного на другой можно было перейти по ссылке вверху страницы "rus/eng", но при этом строка в браузере выглядела так : www.example.com/ru/ ,а не www.example.com/ru/index.html (index.html на русском). Надеюсь понятно
0 votes6 answers -
Вёрстка с позиционированием?
В примере http://demo.fabthemes.com/nautilus/ блоки статей расположены весьма необычно. Их размеры указаны посредством position: absolute. Хотелось поинтересоваться: каждый блок верстается отдельно, со своим расположением? А если это новостной сайт, где при прокрутке страницы подгружаются всё новые и новые статьи? Как можно сверстать подобную страницу с минимумом временных затрат? Должна же быть какая-то хитрость Также интересно как называется такой дизайн.
0 votes2 answers -
отступы в списках между IL и отступ между UL и прилегающими элементам
http://www.htmlbook.ru/faq/?a=14 Это прочитал, у меня написано следующее: UL { margin: 0px;/*отступ*/ list-style-image: url('/bitrix/templates/common/images/list_point.gif'); list-style: inside; /* Маркеры размещаются за пределами текстового блока */ } LI { margin: 3px; } /*А вот абзац*/ p { text-indent: 12pt; font-size: 12pt; color: black; font-family: Arial; padding-top: 5px; /*от верхнего*/ padding-bottom: 5px; /*от нижнего*/ } суть проблемы: <p> Действующие лица трагедии: </p> <ul> <li>Жучка, супер собачка</li> <li>Мурзик, самый крутой котик</li> <li>Шмупсик, самый главный пупсик</li> </ul> Меж…
0 votes5 answers -
Вопрос по уменьшению картинок
Вопрос может быть и не связан с вёрсткой но всёже хочется узнать чем лучше автоматизировать працесс уменьшения картинок для web Есть ли програмка с помащью которой можно всем картинкам задать определённый размер Тоесть у меня 147 картинок 3264x2448 надо все картинки уменьшить до 200px по ширине... В Photoshope это делать очень долго Какая софтина для этого дела подайдёт? Подскажите
0 votes6 answers -
как пофиксить баг в ИЕ6?
сверстал страницу в слоях, но между контентом и боковыми колонками появляется небольшой пробел в ИЕ6, как пофиксить сей баг? <!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" xml:lang="ru" lang="ru"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <link href="css/template_css.css" rel="stylesheet" type="text/css" /> <title>Test</title> </head> <body> <div id="container"> <div id="container-inner"> <div id="header"> HEADER …
0 votes5 answers -
Проблема с выпадающим меню на css
Сделал выпадающую менюшку на чистом css, да вот не задача: работает всё это как-то кривовато, можно посмотреть тут http://cloverdesign.ru/wordpress/ (чёрная стрелочка рядом с синей штуковиной). Спокойно можно поднести мышку и нажать на стрелочку, если использовать :active вместо :hover, но тогда выпадающая менюшка видна только во время клика. Подскажите, пожалуйста, как можно сделать так, чтобы и поднести можно было курсор спокойно и, чтобы менюшка всегда после клика отображалась пока ещё куда-нибудь не тыкну?
0 votes14 answers -
Как сделать маркер списка над текстом по середине???
как сделать???
0 votes9 answers -
Рамка для DIV
Существует такая структура <div> <h1></h1> <div></div> </div> возможно ли сделать рамку из картинок в родительском DIV, т.е. только стилями, элементов больше нет?
0 votes14 answers -
Прозрачность картинки и z-index
Доброго времени суток, сегодня начался рабочий день и я продолжил свою работу по web проекту, но вот наткнулся на одну проблему. Есть модальное окно при открытии которого появляется форма отправки сообщений, и решил я на одной странице добавить картинкам (в постах) прозрачности (css opacity) добавил эффект плавного изменения прозрачности для hover этой картинки и все бы хорошо, но при открытии модального окна картинка вылазит на перед этого окна (как будто кто то дописал z-index:99999;) при чем если убрать свойство opacity у картинки то при открытии модального окна все отображается нормально! Что это может быть? http://test.sud-expertiza.dp.ua/available-properties.html - …
0 votes3 answers -
Слайдер с миниатюрами вместо стрелок
Здравствуйте. Ребята, нужна ваша помощь. Согласно дизайна в слайдере вместо стрелок "prev" и "next" должны отображаться миниатюры предыдущего и следующего слайда. Подскажите, пожалуйста, в какую сторону смотреть или хотя бы как правильно загуглить. У меня идей нет вообще.
0 votes6 answers -
Рисование с помощью CSS3
Когда увидел это чудо, решил тоже создать что то интересное, в связи с чем вопрос, поддерживает ли css3 сплайны? И где можно почитать подробнее про рисование?
0 votes3 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-