NeoXidizer
-
Posts
372 -
Joined
-
Last visited
-
Days Won
5
Content Type
Profiles
Forums
Calendar
Store
Posts posted by NeoXidizer
-
-
при просмотре на широком экране (даже 1366x768) - фигня
в Google Chrome - полная фигня, не хватает clear:both; после логотипа
http://s017.radikal.ru/i402/1203/b9/a505c6164695.png
текст в меню в макете сероватого цвета, а не абсолютно белый
иконки соц. сетей без сглаживания - видны зубцы
к тому же их(иконки) лучше сделать спрайтом
-
что по вашему значит "значимость"?
Тег <code> предназначен для отображения одной или нескольких строк текста, который представляет собой программный код. Сюда относятся имена переменных, ключевые слова, тексты функции и т.д. Браузеры обычно отображают содержимое контейнера <code> как моноширинный текст уменьшенного размера.что вам еще не ясно?
Этот тег не предназначен для создания структуры страницы (чтобы помещать в него div и т.д.)
а уж темболее, не нужно пытаться оптимизировать страницу под поисковые системы, путем использования определенных тегов, думая, что это сильно на что-то влияет
-
кодировку можно менять через более расширенные редакторы, например Notepad++
-
http://programmer-weekdays.ru/archives/176
помните, что ширина окна браузера != стандартная ширина монитора
а лучше сделайте резиновый шаблон
-
просто предоставленный вами код выводит результат, сильно отличающийся от "должно быть" и даже "как получается" из первого поста
-
-
проверьте запрет на javascript, только что перепроверил, все работает, как в режимах совместимости через IE9, так и через IETester
-
Switch74, в HTML5 (<!DOCTYPE html>) для указания кодировки не обязательно так же указывать content-type, тобишь хватит
<meta charset="utf-8" />
а так-же нет необходимости писать в css свойствах "px", если они приравниваются к нулю, тобишь
html,body{margin:0;padding:0;height:100%;}
и не упускай возможности указать повторяющиеся свойства в перечислении классов. Финкальный код:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style type="text/css">
html,body{margin:0;padding:0;height:100%;}
#body{position:relative;min-width:800px;width:100%;min-height:400px;height:100%;}
#site,#header,#content,#footer{position:absolute;left:0;right:0;}
#site{margin:-200px 0 0 -400px;top:50%;left:50%;width:800px;height:400px;background:#ddd;}
#header{top:0;height:50px;background:#eee;}
#content{top:50px;bottom:50px;background:#bbb;}
#footer{bottom:0;height:50px;background:#eee;}
</style>
</head>
<body>
<div id="body">
<div id="site">
<div id="header">
header
</div>
<div id="content">
content
</div>
<div id="footer">
footer
</div>
</div>
</div>
</body>
</html>P.S. работет в последнем Google Chrome, Opera, Firefox, IE7-9
- 1
-
эксперементируйте с <div style="clear:both:"></div>
или выложите сюда код
-
кроссбраузерно вплодь до IE6
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
html,body,div,nav{margin:0;padding:0;}
nav{display:block;}
.clear{clear:both;}
.main{margin:0 auto;width:1002px;height:800px;background:#000;}
nav.menu{width:100%;border-bottom:2px solid #96682E;}
nav.menu a{display:inline-block;width:80px;margin:3px;padding:10px;font:18px Tahoma,Geneva,sans-serif;text-align:center;text-decoration:none;color:#fff;}
</style>
<!--[if lt IE 9]><script type="text/javascript" src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
<div class="main">
<nav class="menu">
<a href="#">новости</a>
<a href="#">биография</a>
<a href="#">embed</a>
<a href="#">audio</a>
<a href="#">video</a>
<a href="#">links</a>
<a href="#">gallery</a>
<a href="#">contacts</a>
<a href="#">top10</a>
<div class="clear"></div>
</nav>
</div>
</body>
</html>Несколько советов:
Начните уже использовать HTML5, он поддерживается всеми браузерами(даже если частично, этого хватает)
Не используйте общие селекторы в CSS (ваша строчка *{margin:0;padding:0;}), это приводит к потери производительности
Используйте UTF8
либо так
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<title></title>
<style type="text/css">
*{margin:0;padding:0;}
.main {background:#000000;
width:1002px;
height:800px;
margin:0 auto;
}
.menu {
list-style:none;
font-family:Tahoma, Geneva, sans-serif;
font-size:18px;
border-bottom:2px solid #96682E;
overflow:hidden;
}
.menu li{
width:80px;
float:left;
padding:10px;
margin:3px;
text-align:center;
}
.menu li a{
display:block;
width:100%;
color:#FFF;
text-decoration:none;
}
</style>
</head>
<body>
<div class="main">
<ul class="menu">
<li><a href="#">новости</a></li>
<li><a href="#">биография</a></li>
<li><a href="#">embed</a></li>
<li><a href="#">audio</a></li>
<li><a href="#">video</a></li>
<li><a href="#">links</a></li>
<li><a href="#">gallery</a></li>
<li><a href="#">contacts</a></li>
<li><a href="#">top10</a></li>
</ul>
<div style="clear:both;"></div>
</div>
</body>
</html>но этот вариант хуже, поверьте, хоть и работает
-
utf-8 without BOM?
-
article, aside, canvas, details,
figcaption, figure, footer, header,
hgroup, nav, section, summary, video {
display: block;
}и все
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
нужен только для IE (и работает только с ним)
-
<!DOCTYPE html>
<html><head>
<title>Горизонтальное меню</title>
<meta charset="UTF-8" />
<style type="text/css">
html,body,nav{margin:0;padding:0;}
nav{display:block;}
nav.menu{float:left;}
nav.menu a{display:inline-block;padding:6px;color:#222;text-decoration:none;font-weight:700;}
nav.menu a:hover{background:#888;color:#fff;}
</style>
<!--[if lt IE 9]><script type="text/javascript" src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head><body>
<nav class="menu">
<a href="#">Пункт 1</a>
<a href="#">Пункт 2</a>
<a href="#">Пункт 3</a>
</nav>
</body></html>html5 нас спасет
P.S. Весь CSS - лишь для задания стиля, без него все работает и меню горизонтальное даже в IE5.5. Лишь javascript для старых IE - обязателен, если в дальнейшем сайт будет верстаться с html5 тегами, а так - все работает и без него, не знаю, в чем вы сложность нашли
Изменение размера логотипа в background: url()
in HTML Coding
Posted
если нужно масштабирование, то лучше через <img width= height= \>