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
-
Проверка кода на валидность
Здравствуйте, уважаемые форумчане! Мысль сделать свой сайт у меня возникла давно, а вот реализовать идею дотянулись руки совсем недавно. Я решил сделать сайт на хостинге Ucoz. Написал каркас дизайна. Решил проверить его на валидность. Проверял через http://validator.w3.org/. Он мне выдал: "6 Errors, 3 warning(s)", но в чем ошибка я не могу понять. <br /> исправил, но ошибки все-равно остаются. Код прикладываю: <удалено> Заранее благодарен.
0 votes2 answers -
Блок с закругленными углами с изображением
Доброго времени суток. Подскажите, пожалуйста, как лучше сверстать вот такой блок Получилось 8 маленьких кусочков, которые нужно слепить в один блок на div Получается что-то подобное: <div class="класс"> <div> <div> <div> <div> <div> <div> <div> Содержимое блока </div> </div> </div> </div> </div> </div> </div> </div> </div> .класс { background : url(1 картинка) top center repea…
0 votes6 answers -
Радиальный градиент уходящий в прозрачность
Доброго дня уважаемые коллеги. Столкнулся с одним очень неприятным нюансом, а именно , не могу придумать, как можно сделать радиальный градиент "уходящим в прозрачность". Чтобы не быть голословным вот демонстрация, как хочется сделать: http://savepic.net/6942734m.png А вот, что у меня на данный момент, получилось http://savepic.net/6943758m.png Код простенький: Код CSS 1 background: #0A85CC radial-gradient(51% 255% at 100% 0%, #2f97d4 97%, transparent) no-repeat; Единственный нюанс, это то, что не могу никак сделать его плавно уходящим в прозрачность. Пробовал сделать линейным (там все здорово, но беда в том, что не получа…
0 votes3 answers -
Убрать вертикальную полосу прокрутки у сайта
Всем доброго времени суток! Подскажите, как можно реализовать такой довольно интересный функционал, который есть на сайте http://www.3magine.com/ Мне нужно, чтобы у сайта не было вертикальной полосы прокрутки, при скролле прокручивался весь цветной блок, который при этом занимает всю доступную высоту экрана. Насчет последнего пункта, в принципе понятно, что можно задать height=100vh, а вот как сделать все остальное, я пока не представляю. Может кто-то сталкивался с подобным?
0 votes2 answers -
Выравнивание по центру "таблицы" (css)
Добрый день! есть такой код: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=cp-1251" /> <style type="text/css"> #title1, #col1 { /* 1 */ font-family: Verdana, Arial, sans-serif; font-weight: bold font-size: 80%; color: white; width: 600px; padding: 5px; border: 1px solid black; margin-left: 5px; margin-top: 2px; float: left } #col1 { /* 2 */ font-family: "Times New Roman", Times, serif; font-size: 100%; font-weight: normal; color: black } /* Цвет фона каждого слоя */ #title1 { background: #008159 } #col1 { background: #BBE1C4 } #tr { /* 3 */ clear: both } </style></head> <…
0 votes2 answers -
Декоративное подчеркивание многострочного текста
Нужно сделать ссылкам пунктирное подчеркивание. Обычно, текст ссылок знимает 2 строки или больше. Выставил line-height, подобрал размер aоновой картинки и все получилось, но только не в IE. Подскажите, как побороть осла?
0 votes1 answer -
Составные инпуты в FF: что откуда?
В FF есть файл forms.css (под WinXP — в подпапке res папки установки), в котором написаны интересные вещи (спасибо мозилловскому форуму за наводку, а этому форуму — за наводку на мозилловский). В частности, упоминаются некие select > input[type="button"] input[type="file"] > input[type="text"] input[type="file"] > input[type="button"]а также их особые состояния, комбинации и т.п. Что это? Действительно ли для Мозиллы некоторые элементы форм являются составными и если да, можно ли стилизовать их по частям (я попробовал — "в лоб" не получилось, но, может, я что-то делал не так)? Или эти строчки — пережиток какой-то древней версии движка (версия навеяна комментом "…
0 votes6 answers -
css вертикальное меню
Здравствуйте! проблема в том, что третий уровень открывается с верху, а не напротив кнопки, которая его открывает CSS: #nav, #nav ul{ margin:0; padding:0; list-style-type:none; list-style-position:outside; position:relative; line-height:1.5em; display:inline-block; z-index:1; } #nav a:link, #nav a:active, #nav a:visited{ outline:none; display:block; padding:0px 5px; border:1px solid #333; color:#fff; text-decoration:none; background-color:#333; } #nav a:hover{ background-color:#fff; color:#333; } #nav li{ float:none; position:relative; width:180px; } #nav ul{ margin-left:10px; margin-top:-10px; position:absolute; width:12em; top:1.5em; dis…
0 votes2 answers -
Отступ в таблице
Не получается никак сделать такой же самый отступ от надписи <style type="text/css"> .foto_otstyp{margin:30px;} .verx_otstyp20{margin-top:20px;} .zagolovok_ul2{font-size:26px; font-weight:bold; margin-left:60px; color:#CC0000;} </style> <div class="zagolovok_ul2">Что блог может дать именно Вам?</div> <table> <tr> <td><img class="foto_otstyp" src="../img/3_6.3.jpg" /></td> <td width="100%"> <strong>Если Вы владелец бизнеса,</strong> блог будет для Вас отличной <br /> Интернет-площадкой, которая даст Вам следующие <br /> преимущества: <div class="verx_otstyp20"></div&g…
0 votes5 answers -
Псевдоклассы a.active + a.hover
Здравствуйте. Помогите, пожалуйста, решить вопрос: есть меню с псевдоклассами .a.link, a.active и a.hover. Для каждого псевдокласса свои цвета текста (link чёрный, hover чёрный, active синий). Задача: сделать active при наведении (при hover т.е.) синим (т.е. просто hover ссылки должны быть чёрным, но active hover синим). Активный пункт меню: ul.sd-hmenu>li>a.active { color: #0D6EAB; } Как решить вопрос выше? Пробую перечислением: ul.sd-hmenu>li>a.active, .sd-hmenu>li>a.hover { color: #0D6EAB; } В чём ошибка?
0 votes4 answers -
Выпадающее меню без javascript
Мне выпадающее меню дается очень с трудом. Оно, конечно у меня выпадает, но выглядит не так как хотелось бы. http://thelast.ru/index.php?uid=599 - беру пример вот с этого, правда там вертикальное меню, а у меня горизонтальное, и это усложняет мою задачу. Помогите пожалуйста привести все это в порядок Код: <div class="menu"> <ul> <li><a href="#">Верстка</a></li> <li><a href="#">Создание сайта</a></li> <li><a href="#">Веб-дизайн</a></li> <li class="web"><a href="#">Веб-программирование</a> <ul> <li><a href="#">Java-Script</a></l…
0 votes4 answers -
margin: 0 auto для меню span float:left
Добрый день! Не получается .menu span сделать по центру блока .menu .wrap {position: relative; min-height: 100%; height: auto; -height: 100%;} .container {margin: 0 auto; padding-bottom: 198px; min-width: 998px; max-width: 1000px;} .content {padding: 80px 0px 0px 13px;} .head {padding: 0; height: 247px; background: #ffffff url(../img/headerbg.jpg) 50% 100% no-repeat;} .logo {width: 187px; height: 49px; padding: 77px 0 0 64px;} .logo img {width: 180px; height: 146px;} .foot {background: #ffffff url(../img/footerbg.jpg) 50% 0 no-repeat; width: 100%; position: absolute; bottom: 20px; height: 129px; z-index: 22; left: 0;} #foot {margin: 0 auto; min-width: 998px; max-width…
0 votes2 answers -
Input не работает по краям
Не работает кнопка если нажать по бокам. Если по тексту то работает Вот скрин. На скрине видно что есть отступы в 20px, из-за них как раз таки и не работает вот код <div><a class="post" href="#"><input type="submit" name="new_answer_btn" id="new_answer_btn" value="Отправить"/><em></em></a></div> и стили .new-answer .post, .new-private-answer .post { position: relative; display: inline-block; margin-top: 20px; padding: 0 20px; height: 27px; background: url(/design/main/images/btnbg.png) -12px 0 no-repeat; color: #fff; text-decoration: none; line-height: 26px; font-weight: bold; font-size: 1.167em; } .new-…
0 votes6 answers -
Поблема с фоном
Подскажите пожалуйста! Я на фоновый рисунок поставил некое изображение, растягивающееся на весь экран (резиновый фон), задал относительное позиционирование (position:relative;) и сдвиг от нижнего края экрана (bottom: 240px;)... Изображение действительно сдвинулось на 240 пикселей от низа, как я и хотел, но под ним образовался пробел (что, в принципе, естественно). Объясните пожалуйста мне - ламеру, как избавиться от пробела или заполнить его! Заранее спасибо! Скрин выше!
0 votes8 answers -
Div: обязательно все элементы в него "оборачивать"?
Недавно осваивать html взялся. В небольшом количестве примеров, которые видел, чекбоксы, кнопки "оборачивают" в div. Это обязательно? Если да, то что будет, если этого не делать или где-нибудь пропустить элемент? В html5 видел учебный пример, там сам текст "оборачивают" в section и article.
0 votes6 answers -
Секмантика
Всем привет есть заголовок в котором два слова. Первое слово заглавными буквами второе прописными. Вопрос с точки зрения семантики правильно ли так писать <h2>слово1<span>слово2</span></h2> потом в ксс h2{ text-transform: uppercase } спасибо
0 votes11 answers -
Перевод верстки на html5
Есть вёрстка вебсайта на html/css как перевести на html5?
0 votes7 answers -
Как сделать правый бар с помощью bootstrap grid?
Каждый пост .row с 8 колонками и правый бар с 4 колонками, как сделать что правый бар не зависило от .row т.е правые колонки будут разной высоты не зависимости от от высоты поста? Это надо использовать Flex или Masonry? Сайт Html код Макет как должно быть
0 votes1 answer -
Якори
Здравствуйте, вопрос такой, как сделать что бы при открытии страницы она открывалась в определенном месте. Нужно не показывать шапку сайта начиная сразу с основного контента.
0 votes2 answers -
Использование rem для задания размеров элемента
Всем привет. Слышал советы, что вместо пикселей желательно использовать rem для задания размеров. Решил, в качестве эксперимента, попробовать задать для html определённый размер в пикселях, а дальше везде использовать уже rem. И вроде всё нормально, даже очень удобно. Но под конец решил я уменьшить масштаб страницы и вот тут появились проблемы. Если использовать такой код: html { font-size: 10px; } .box { background: red; width: 100px; height: 400px; } То по итогу всё нормально, сколько масштаб не уменьшай, результат всё те же 400px. Но стоило изменить единицы измерения в высоте: html { font-size: 10px; } .box { background: red; wid…
0 votes0 answers -
Помогите разобраться. (разрешение экрана)
Всем привет. У меня при верстке сайта по уроку возникла проблема. Сверстал все один в один (перепроверил несколько раз), но по итогу получается смещение элементов. Из за чего такое может произойти? Ссылку на скрин оставлю ниже (1левый экран то как у него, а (2)правый то как у меня) Скрин для наглядности, чтобы понять о чем я. Spoiler https://ibb.co/88wDBzq
0 votes5 answers -
Большая копия картинки.
Здравствуйте, я бы хотел поинтересоваться, можно ли как либо без Java сделать так: На странице есть маленькая копия картинки 150 на 250 px, хотелось бы сделать её ссылкой, на большую копию этой картинки, но так что бы она (копия) открывалась на этой же страничке поверх всех других элементов, и после просмотра можно было бы её закрыть? А если без Java нельзя, то трудно ли сделать это с java?
0 votes2 answers -
размеры элемента <a>
подскажите плз, при каком DOCTYPE можно задавать фиксированные размеры элемента <a> — ширину и высоту через CSS
0 votes3 answers -
float: left
http://borber.ru/htmlbook/template5.html Вот тут обычный вариант «двухколоночного макета». Меню идёт с float: left. Далее нам нужно вставить много (неизвестно сколько именно) блоков 100×100, которые бы тоже бы были с float: left; А потом ещё раз такие же блоки. Само собой, надпись «Вторые блоки» тоже попадает под раздачу. Что делать, думаю я про себя. Вставляю пустой блок с clear: left, который до кучи хватает ещё и колонку с меню. http://borber.ru/htmlbook/template6.html Как бы вот так сделать, чтобы и left «почистить» и меню не захватывать?
0 votes6 answers -
Верстка CSS - вопросы по моему сайту
Всем привет! Я скачал, посмотрел и выполнил все (почти все) уроки по html и css - и собрал демо-версию своего сайта, он очень простой - трехколоночный информационный сайт (он будет посвящен компьютерной графике). Я прилагаю его в архиве http://files.mail.ru/QK7K71 потому что писать здесь код неудобно, он достаточно большой, к тому же в оформлении я использовал картинки. Но у меня возникли трудности. В архиве находятся две папки - в одной из них сам сайт (папка img с картинками, файлы сайта verstka-div.css и verstka-div.htm, а в другой папке рисунок (Он называется "Вопрос" на котором я показываю области, которые я не могу разместить на сайте.) На местах отмеченных знаком …
0 votes8 answers