amelice
-
Posts
583 -
Joined
-
Last visited
-
Days Won
13
Content Type
Profiles
Forums
Calendar
Store
Posts posted by amelice
-
-
Помогите разобраться.
Хотелось бы узнать как добиться, чтоб первый элемент каждый раз при наведении мыши на него менял свой цвет с белого на черный и наоборот.
-
<a href="http://id68698.al11.luxup.ru" target="_blank" style="overflow: hidden; text-align: left; vertical-align: top; padding: 10px; color: rgb(14, 114, 181);">Ландшафтный дизайн и озеленение от компании "Веди"</a>Вертикальный padding не работает для строковых элементов. А горизонтальный padding работает только с краями строки.
То есть когда одна большая строка разбивается на части, при переводе на следующую строку, отступ будет действовать на первую слева и на последнюю строку справа.
overflow: hidden, text-align: left - не применяются для строковых элементов.
-
Значит, что он при скролле окна никуда не уедет, а так и останется висеть там куда мы его пришпилим, т.е. на всю видимую область. Это избавит нас от необходимости что-то высчитывать.
Great Rash, спасибо, понятно.
Подход неверный. Вот так правильно будет:
div.loader {
position: fixed;
width: 100%;
height: 100%;
}Осталось только эмулировать fixed при помощи экспрешна в старых ИЕ.
Но, без указаний позиций
top:0;
left:0;не работает. Поэтому, позиции нужно добавить в стили.
-
Значит если мы назначим лоадеру position: absolute;, нам придется высчитывать высоту <body> и ставить эту высоту лоадеру иначе при скролле он уедет наверх.
position: fixed; решает все эти проблемы без лишних скриптов.
Это значит, что fixed не тратит время на высчитывание высоты контента, а просто берет высоту окно просмотра при height:100% и будет отображаться?
-
Область дива должна распространяться и за пределы видимости экрана если контента очень много
В таком случае, не нужно указывать 100% для элемента html - в этом случае, он берет высоту окна просмотра(так как оно является родителем для корневого элемента).
Но не уверена, хотелось бы услышать еще другие мнения по этому поводу.
Подход неверный. Вот так правильно будет:
div.loader {
position: fixed;
width: 100%;
height: 100%;
}Осталось только эмулировать fixed при помощи экспрешна в старых ИЕ.
Great Rash, можешь объяснить почему? Очень интересно.
-
* {
border:0;
font-family: Tahoma, Arial, Verdana;
font-size:12px;
margin:0;
outline:none;
padding:0;
}
html, body {
background:#FFFFFF;
margin:0;
padding:0;
height:100%;
min-height: 100%;
}
* html body { height: 100%; min-height: 100%;}
<div style="background:yellow;width:100%;height:100%;_height: 100%;position:absolute;display:block;text-align:center;" id="loader">
<h1 style="font-size:30px;margin:100px 0 0 0;">Идет загрузка страницы</h1>
<img src="img/loading.gif" />
</div>Попробуйте:
body {
background:#FFFFFF;
margin:0;
padding:0;
position:relative;
}
#loader{ top:0;
left:0;
background:yellow;
width:100%;
height:100%;
position:absolute;
text-align:center;
}
<div id="loader">
<h1 style="font-size:30px;margin:100px 0 0 0;">Идет загрузка страницы</h1>
<img src="img/loading.gif" />
</div>В ИЕ6 не работает. а в ИЕ7 не проверяла, в ИЕ8, ФФ4 работает.
-
Я имел в виду полосатую "табличку" с датами и ссылками. До правки, если ссылка не вмещалась в одну строку (я пробовал добавить пару слов текста через Firebug), она целиком опускалась вниз, под дату. Сейчас (как минимум, в FF5) не проваливается, дату как бы обтекает — уже намного лучше. Но, по-моему, было бы еще лучше, если бы вторая строка ссылки начиналась под первой, как в настоящей табличке...
Сделала, спасибо.
-
когда я использую padding-top у меня слой вытягивается в высоту на то кол пикселей, на которое я смещаю текст вниз.
Попробуйте задать внешнему блоку div class="photo" высоту:260px.
А внутренним блокам padding-top.
-
В IE5 так или иначе будет караул, не в одном, так в другом
. Он не только центрировать блоки по стандарту не умеет, у него вообще вся боксовая модель нестандартная. От него массово отказались еще в 2005-м. Сейчас многие уже IE6 поддерживать отказываются, зачем откапывать еще больший антиквариат Да, скорее бы уже Ие6 закончил свой век существования.
Для таких не образованных как я было б намного проще
)Я имел в виду полосатую "табличку" с датами и ссылками. До правки, если ссылка не вмещалась в одну строку (я пробовал добавить пару слов текста через Firebug), она целиком опускалась вниз, под дату. Сейчас (как минимум, в FF5) не проваливается, дату как бы обтекает — уже намного лучше. Но, по-моему, было бы еще лучше, если бы вторая строка ссылки начиналась под первой, как в настоящей табличке...
Думаю, можно сделать inline-block'ом. Щас попробую.
-
напишите пожалуйста в коде как должно быть ,а то не выходит никак.
css:
вместо
#logo {
width: 64px;
height: 95px;
margin-left:55px;
background: url(logotip1.png) no-repeat;
}попробуйте вот это прописать:
.logo{
margin-left:55px;
}html:
вместо:
<a href= "главная.html"><img src= "logotip1.png"> </a>
это:
<a class="logo" href = "index.html"><img src = "logotip1.png" width = "64" height="95" alt="logo"></a>
Имейте в виду, что <а> строковый элемент, если вдруг захотите применить вертикальный margin, не прокатит. В таком случае нужно использовать блочный элемент. Или поменять представление элемента <а>.
-
Что мне бросилось в глаза:
- Некоторые списки явно лишние, как минимум #abs и #inside_content (никакие однотипные сущности в них не перечисляются, li-шки фактически зря дублируют вложенные в них div-ы, да и form можно использовать как полноценный контейнер);
- Картинку zd-bg_02.jpg лучше сделать фоном, она не несет самостоятельной информационной ценности;
- Очень непрочная структура списка .simple_1, стоит ссылке стать на два-три слова длиннее, она некрасиво сползает вниз. Надо предусмотреть возможность отображения более длинных текстов в несколько строк.
А так в целом аккуратненько. Сама страница несколько специфичная — без явного основного контента, фактически вся из разных сортов навигации, поэтому про последовательность блоков в коде спорить не о чем.
Желаю дальнейшего прогресса и всяческих удач!
Большое спасибо!
1. Убрала #inside_content. По поводу #abs подумаю, как можно форму использовать вместо него.
2. Не понимала суть бекграунда. Теперь знаю, что нужно было сделать фоном эту картинку. Так и сделала.
3. Переделала .simple_1, но не знаю, что ты имел в виду конкретно.
- Некоторые списки явно лишние, как минимум #abs и #inside_content (никакие однотипные сущности в них не перечисляются, li-шки фактически зря дублируют вложенные в них div-ы, да и form можно использовать как полноценный контейнер);
-
cheburek, Вот, зацени тут, вроде более-менее решена проблема с градиентом http://psywalker.ru/Portfolio/BusinessName.com/main-page.html
Применила твой метод
Везде работает, но, в Ие5 караул. В ИЕ 5 нужно будет отцентрировать весь сайт, так как бекграунд у меня top center, а свойство margin:auto для блоков не работает(как мне кажется), то мой плавный градиент сам по себе гуляет в центре.
)Как решить эту проблему?
А за метод спасибо! Мне понравился, просто и не долго.
-
Но насколько я вижу эта таблица еще для html4, а с тех пор немало воды уже утекло (xhtml, html5)
Пишется "HTML4" — читается "HTML 4.01 и XHTML 1.0". Содержательно это одно и то же, разница только в базовом синтаксисе. А XHTML 1.1 = XHTML 1.0 Strict + (пара спецтегов для японск. яз.) - (name для форм и якорей), т.е. на 99.5% — тот же добрый старый HTML 4.01 Strict.
Нельзя в хтмл задавать визуальное представление (повторюсь, <strong> -это смысловое выделение, а <b> - визуальное)
А вот как раз это для HTML4/XHTML1
. В HTML5/ЖHTML <b>, <i>, <small> и подобные — не визуальное выделение, а скорее стилистическое.А про градиенты есть неплохая (имхо) статья на Хабре...
SelenIT, а есть у тебя замечания по верстке? Если не трудно посмотри пожалуйста верстку. Спасибо.
-
1
-
-
Насчёт <b> спорный момент, для SEO наоборот, стараются ключевые слова выделять жирным, поисковики так лучше повышают "вес" подобных слов. Для вёрстки удобнее через стили жирность задавать, в любой момент можно её убрать, цвет изменить или другие параметры. Для семантики лучше <strong> использовать, чтобы какие-нибудь речевые браузеры осмысленно диктовали этот текст.
Как видите, вариантов несколько и каждый будет на себя одеяло тянуть, поскольку смотрит со своей колокольни. Чтобы вам не растеряться в такой ситуации, пока придерживайтесь какого-то одного решения. Потом уже, как ознакомитесь с другими направлениями, вам будет понятнее, что в какой ситуации оправданнее.
Влад, спасибо за подробное разъяснение. Так как я пока макеты для себя делаю, и хочу научится правильно верстать с учетом семантики, то значит буду использовать <strong>.
-
Но в макете было просто жирный текст. А вообще, применяемость того или иного элемента я смотрю тут. Где D-запрещен, значит этот элемент не использую. Это так?
а элемент b он вроде не запрещен.
Запрещенные - F, устаревшие - D.
Но насколько я вижу эта таблица еще для html4, а с тех пор немало воды уже утекло (xhtml, html5)
Нельзя в хтмл задавать визуальное представление (повторюсь, <strong> -это смысловое выделение, а <b> - визуальное)
Все оформление должно быть в стилях.
Понятно.
Еще не использовала h1.
Как я понимаю, это с точки зрения SEO, необходимо наличия элемента h1? а что если его не использовать, но использовать другие, например начиная с h2?
-
Градиенты лучше сохранять в PNG, будет небольшой объём файла и цвета останутся исходными. Но здесь искажения, пожалуй, по любому будут, пусть и не очень заметные, потому что фотография в JPEG, а он цвета "портит", что довольно заметно становится при наложении одного изображения на другой.
Когда сохраняла картинки в фотошопе для веба, там можно посмотреть 4 варианта форматов. Png8 - качество ужасное, там где градиенты плавные, заметно - расслаивание по пикселям.
Png-24 намного лучше по качеству и больше по объему, но там тоже видны расслаивание пикселов. А jpeg(качество 75) - мне показалось лучшим вариантом из всех. И по объему меньше чем png-24.
Может, что-то нужно включить дополнительно?
3. Сначала применила b , но тут написано, что нужно - strong вместо b.
Все правильно ты делаешь, <strong> для смыслового выделения текста и для поисковиков, а просто жирный шрифт задается через font-weight: 700;
Gaspode что-то перепутал..
Но в макете было просто жирный текст. А вообще, применяемость того или иного элемента я смотрю тут. Где D-запрещен, значит этот элемент не использую. Это так?
а элемент b он вроде не запрещен.
cheburek, Вот, зацени тут, вроде более-менее решена проблема с градиентом http://psywalker.ru/Portfolio/BusinessName.com/main-page.html
psywalker, изучаю.
-
Ссылки на наведение не реагируют.
<div class="left">
<div class="right">Нехорошо.
<li class="raz">
Ужасно.
<strong> Fusce nec eros augue</strong>
Тут лучше b, а не strong.
Спасибо!
1. Исправила.
2. Исправила. Но хочу понять, почему ужасно?
Только в менюшке оставила класс li.not_b. для первого элемента списка,
так как нужно убрать слева бордер(в старых ИЕ).
а для ИЕ>7 и других браузеров использовала:
#nav ul li+li{
background:url(img/lin_menu.jpg) no-repeat;
}Можно было :first-child применить, но мне кажется так более приоритетно.
3. Сначала применила b , но тут написано, что нужно - strong вместо b.
-
Привет всем!
Выкладываю первый макет с форума.
Так как выкладываю на бесплатный хостинг,справа вылазит всякая реклама.
А по макету, попинайте хорошенько.
Проверила в старых ИЕ, вроде работает. Но не уверена, так как для меня - работает, может для вас караул.
И еще вопрос, у меня не получается плавный градиент.
Как добиться, чтоб не было четкой линии? -
Да словами можно куда угодно полететь. Аул в Казахстане, у нас айыл.
и не Восток, а Средняя азия.
Прошу прощения, я только с казахами плотно общался.
Для меня все, что восточнее Украины - Восток) Ближний Восток, Средний Восток, Дальний Восток, но все равно Восток)
Понятно, для тебя кроме Украины все - восток, а Украина это эапад? (это больше риторический вопрос.)
Извини, но давай не будем флудить.
-
Если очень захотеть, можно не только в космос полететь, но даже в Киргизском ауле шпарить на инглише лучше, чем Барак Обама)
Эхх, Восток...)
Да словами можно куда угодно полететь. Аул в Казахстане, у нас айыл.
и не Восток, а Средняя азия.
-
Английский никакой.
а вот это ты зря. Англоязычный интернет всегда впереди рунета в любой сфере деятельности, а особенно в том, что касается IT.
Если хочешь быть впереди конкурентов - учи английский хотя бы на уровне понимания того, о чем пишут. Все новинки там.
Я вот, честно говоря, не понимаю как можно не знать базовый английский в нашем мире, где этот язык есть стандартом априори) Весь интернет английский, интерфейсы большинства программ - английские, общение с иностранцами - английский, интересные статьи - тоже инглиш, лучшие работодатели - инглиш, учим со 2-го класса иннглиш, в университете обязательная программа - инглиш(ну, у нас так. Хотя еще бывает немецкий и реже французский на выбор))
В то время, когда я была школьницей, в моей школе(Киргизия, село) преподавали немецкий и русский.
В институе начала изучать русский, английский. Английский разговорный быстро освоила, а русский очень тяжело было изучать. до сих пор изучаю.но потом английский забросила, так как нет практики, на работе не требовалось и все такое.
а щас вот начала изучать html,css, то тут конечно вижу, что нужно еще знать технический инглиш. Потихонечку буду учить.
-
Как раз сейчас Мейера читаю, да там в контексте определенной темы написано поддерживаются ли старыми ИЕ то или иное свойство. Но как решать их ниразу не встречала.
Да, Мейер больше фундаментально пишет. Т.е. как это должно работать в идеале.
Если хорошо с английским, то можешь почитать эту книгу - http://books.google.com/books?id=l3dGJn3NydUC&printsec=frontcover&dq=mcfarland&hl=ru&ei=UgAUTtqrBI6gOr-p3aIL&sa=X&oi=book_result&ct=result&resnum=3&ved=0CEYQ6AEwAg#v=onepage&q&f=false
Там как раз описаны все основные баги ИЕ6/7 и способы их решения. И в целом книга очень хорошая для новичков. Рассказано как верстать отдельные элементы, например меню (горизонтальные, вертикальные), списки, таблицы, основные разметки сайтов. Есть самостоятельные упражнение. Т.е. упор больше делается на практику. Теории, как у Мейера там не так много. На русском она выходила под названием "Большая книга CSS"
Английский никакой.
Русский вариант в лабиринте уже заказала. Везде отзывы по этой книжке очень хорошие.
Спасибо!
-
SelenIT, sigma77 спасибо вам большое!!!
Не могу нарадоваться, глаза разбегаются по ссылкам!
а главное именно то, что мне нужно.
Как раз сейчас Мейера читаю, да там в контексте определенной темы написано поддерживаются ли старыми ИЕ то или иное свойство. Но как решать их ниразу не встречала.
Мне в этом форуме очень понравилось атмосфера, отзывчивость ребят, те кто постоянно здесь.
Спасибо.
-
до сих пор сидел соображал как это работает, разобрался. SelenIT, а ты мастер на такие штуки хитрые. Прошлый раз для теней соорудил конструкцию
Искушенный в этом деле - придумывать нестандартные решения?Да, круто получилось.
Мне теперь это нужно догонять..
Softlink, а что конструкция? можешь ссылку дать на неё?
Макет под 800 по центру
in HTML Coding
Posted
Основному блоку задайте стили: