Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 11.02.2012, 19:10   #11
titan2012
Пользователь
 
Аватар для titan2012
 
Регистрация: 07.02.2012
Сообщений: 95
По умолчанию

да, ты прав, немного тупанул, щас исправился) я поставил меню на первое место, а потом контент, и все это включил в тег контейнер для того чтобы при добавлении инфо у тебя этот div растягивался вниз
вот html
Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

	<title></title>
	<meta charset="utf-8"/>
	<meta name="keywords" content="" />
	<meta name="description" content="" />
	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection" />
</head>

<body>

<div id="wrapper">

	<div id="header">
		<img src="img/header.jpg" width="900" height="120" />
	</div><!-- #header-->

	<div id="middle">

		<div id="container">
		<div id="left">
		<div class="sidebar" id="sideLeft">
			<h1>Содержание</h1>

<ul> 
<li><a href="1.html">01</a></li>
<li><a href="2.html">02</a></li>
<li><a href="3.html">03</a></li>
<li><a href="4.html">04</a></li>
<li><a href="5.html">05</a></li>
<li><a href="6.html">06</a></li>
<li><a href="7.html">07</a></li>
<li><a href="8.html">08</a></li>
<li><a href="9.html">09</a></li>
<li><a href="10" class="notopbrdr0xNone">10</a></li>
</ul>
            
		</div><!-- .sidebar#sideLeft -->
		</div>
											<div id="content">
											<h1>ГЛАВА 1. Пробуждение.</h1>
														
											<p>"But I must expl"

											<div id="pagiantion"><a href="2.html">Следующая страница</a></div>
										
											</div><!-- #content-->
										    </div><!-- #container-->
											</div><!-- #middle-->

	<div id="footer">
		<img src="img/footer.jpg" width="900" height="40" />
	</div><!-- #footer -->

</div><!-- #wrapper -->

</body>
</html>
titan2012 вне форума Ответить с цитированием
Старый 11.02.2012, 19:14   #12
titan2012
Пользователь
 
Аватар для titan2012
 
Регистрация: 07.02.2012
Сообщений: 95
По умолчанию

вот css прилагаю
Код HTML:
/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
:focus {
    outline: 0;
}
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
body {
    font: 12px Verdana, sans-serif;
    width: 100%;
    background-color: #f7f5e3;
    color: #17181A;
}
a {
    color: blue;
    outline: none;
    text-decoration: underline;
}
a:hover {
    text-decoration: none;
}
p {
    margin: 0 0 18px
}
img {
    border: none;
}
input {
    vertical-align: middle;
}

#start {
    width: 409px;
    height: 499px;
    margin: 25px auto;
}
#start a {
    border: none;
}

#start p {
    text-align: center;
    font-family: Verdana;
    font-size: 11px;
    color:#333;
}

#wrapper {
    width: 900px;
    margin: 0 auto;
    border: 1px solid #EDE4A3;
    background-color: #fff;
}


/* Header
-----------------------------------------------------------------------------*/
#header {
    height: 120px;
    background: #FFE680;
}


/* Middle
-----------------------------------------------------------------------------*/
#middle {
    width: 100%;
    height: 1%;
    position: relative;
}
#middle:after {
    content: '.';
    display: block;
    clear: both;
    visibility: hidden;
    height: 0;
}
#container {
    width: 100%;
	top:0;   
}
#content {
    padding: 0 0 0 270px;   
}

#content h1 {
    margin: 25px;
    font-weight: bold;
    color: #333;
    margin-left: 20px;
    font-size: 20px;
}

#content p {
    margin: 20px;
}


/* Sidebar Left
-----------------------------------------------------------------------------*/
#left{float: left;
top:0}
#sideLeft li {
display: inline;
}

* html #sideLeft a {
height: 1px;
}

#sideLeft ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: bold;
    text-decoration: none;
    }

#sideLeft  h1{
    font-size: 20px;
    font-weight: bold;
    color: #127812;
    margin: 25px;
    text-align: center;
}

#sideLeft {
    width: 200px;
    margin: 10px;
    border-top-width: 0;
    border-right-width: 0;
    border-bottom-width: 0;
    border-left-width: 0;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #FF0000;
    border-right-color: #FF0000;
    border-bottom-color: #FF0000;
    border-left-color: #FF0000;
    }

#sideLeft li a {
    text-decoration: none;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-color: #870000;
    }
#sideLeft .notopbrdr0xNone {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    }

#sideLeft li a:link, #sideLeft li a:visited {
    color: #870000;
    display: block;
    background-color: #F2D6A4;
    padding-top: 3px;
    padding-right: 0;
    padding-bottom: 3px;
    padding-left: 10px;
    }

#sideLeft li a:hover {
    color: #FFFFFF;
    background:  #870000;
    padding-top: 3px;
    padding-right: 0;
    padding-bottom: 3px;
    padding-left: 10px;
    }
/* Footer
-----------------------------------------------------------------------------*/
#footer {
    height: 40px;
    background: #BFF08E;


}

#pagiantion {
    margin: 40px;
    text-align: center;
}

#pagiantion a {
    font-size: 20px;
    text-decoration: underline;
    color:#08A9BD;
}
и два рисунка, там где например текста нету и где есть
Изображения
Тип файла: jpg 1.jpg.jpg (92.2 Кб, 125 просмотров)
Тип файла: jpg 2.jpg.jpg (12.5 Кб, 103 просмотров)
titan2012 вне форума Ответить с цитированием
Старый 11.02.2012, 19:34   #13
segail
Форумчанин
 
Регистрация: 13.06.2009
Сообщений: 691
По умолчанию

Мне кажется вот такое расположение боле мене правильно.
Обратите на <div id="container"> Меню не должно входить в <div id="container"> </div><!-- #container-->
Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />	<title></title>

           <title></title>
           <meta charset="utf-8"/>
	<meta name="keywords" content="" />
	<meta name="description" content="" />
	<link rel="stylesheet" href="style.css" type="text/css" media="screen, projection" />
</head>

<body>

<div id="wrapper">

	<div id="header">
		<img src="img/header.jpg" width="900" height="120" />
	</div><!-- #header-->

	<div id="middle">

<div id="container">
	<div id="content">

		<h1>ГЛАВА 1. Пробуждение.</h1>
                        
            	<p>" Текст But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?"
			<div id="pagiantion"><a href="2.html">Следующая страница</a></div>
	
	</div><!-- #content-->		
</div><!-- #container-->




	<div id="left">
		<div class="sidebar" id="sideLeft">
				<h1>СОДЕРЖАНИЕ</h1>
			<ul> 
			<li><a href="1.html">01</a></li>
			<li><a href="2.html">02</a></li>
			<li><a href="3.html">03</a></li>
			<li><a href="4.html">04</a></li>
			<li><a href="5.html">05</a></li>
			<li><a href="6.html">06</a></li>
			<li><a href="7.html">07</a></li>
			<li><a href="8.html">08</a></li>
			<li><a href="9.html">09</a></li>
			<li><a href="10" class="notopbrdr0xNone">10</a></li>
			</ul>            
		</div><!-- .sidebar#sideLeft -->
	</div><!-- #left-->



	</div><!-- #middle-->

	<div id="footer">
		<img src="img/footer.jpg" width="900" height="40" />
	</div><!-- #footer -->

</div><!-- #wrapper -->

</body>
</html>
На данный момент используя данный код отображаются иероглифы в:
<h1>СОДЕРЖАНИЕ</h1>
<h1>ГЛАВА 1. Пробуждение.</h1>
<div id="pagiantion"><a href="2.html">Следующая страница</a></div>

Также меню не корректно стало отображаться в браузере IE, а то есть вообще не отображается… Хотя до этого хоть не правильно но отображалось.
segail вне форума Ответить с цитированием
Старый 11.02.2012, 19:50   #14
titan2012
Пользователь
 
Аватар для titan2012
 
Регистрация: 07.02.2012
Сообщений: 95
По умолчанию

поменяй кодировку на utf-8, у меня все отображается нормально, и в IE тоже все норм)
скопируй все как у меня, должно работать.
на счет контейнера, то ты все таки прав, я слегка запутался в дивах
titan2012 вне форума Ответить с цитированием
Старый 11.02.2012, 20:07   #15
segail
Форумчанин
 
Регистрация: 13.06.2009
Сообщений: 691
По умолчанию

При использование таких мето тегов
<title></title>
<meta charset="utf-8"/>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection" />

У меня все в корневой папке
<link rel="stylesheet" href="style.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection" />



Не знаю как отобразить текст…

Последний раз редактировалось segail; 11.02.2012 в 20:27.
segail вне форума Ответить с цитированием
Старый 11.02.2012, 20:26   #16
segail
Форумчанин
 
Регистрация: 13.06.2009
Сообщений: 691
По умолчанию

При таком варианте так


<title></title>
<meta charset="utf-8"/>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link rel="stylesheet" href="style.css" type="text/css" media="screen, projection" />
Изображения
Тип файла: jpg meta.JPG (35.2 Кб, 40 просмотров)
segail вне форума Ответить с цитированием
Старый 11.02.2012, 20:31   #17
titan2012
Пользователь
 
Аватар для titan2012
 
Регистрация: 07.02.2012
Сообщений: 95
По умолчанию

через что пишешь сайт?
я лично в notepad++
там есть Кодировки ----- кодировать в utf - 8 (без BOM)
тебе текст сначала в кракозябры переделает, ты его замени и сохрани еще раз, это действие проделай для каждой странички и для стилей
просто когда загружал твой код, то тоже такое было
titan2012 вне форума Ответить с цитированием
Старый 11.02.2012, 20:38   #18
segail
Форумчанин
 
Регистрация: 13.06.2009
Сообщений: 691
По умолчанию

Цитата:
Сообщение от titan2012 Посмотреть сообщение
через что пишешь сайт?
я лично в notepad++
там есть Кодировки ----- кодировать в utf - 8 (без BOM)
тебе текст сначала в кракозябры переделает, ты его замени и сохрани еще раз, это действие проделай для каждой странички и для стилей
просто когда загружал твой код, то тоже такое было
Пишу в блокноте
Кодировка ANSI
Вроде раньше сохранял в кодировки ANSI и нормально было
segail вне форума Ответить с цитированием
Старый 11.02.2012, 20:45   #19
titan2012
Пользователь
 
Аватар для titan2012
 
Регистрация: 07.02.2012
Сообщений: 95
По умолчанию

или поставь обратно windows или же смотри код выше, ты там два раза указал
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title></title>

<title></title>
<meta charset="utf-8"/>
titan2012 вне форума Ответить с цитированием
Старый 11.02.2012, 20:51   #20
segail
Форумчанин
 
Регистрация: 13.06.2009
Сообщений: 691
По умолчанию

Изменил. Открыл файл блокнотом и сохранил в utf-8. Текст появился.
В опере отображается корректно, в ie 6 меню вообще нету. То есть картинка выглядит корректно, а меню вообще нету или не видать…
segail вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ограничивающие по вертикали линии в RichEdit artemavd Общие вопросы Delphi 5 24.08.2010 09:05
автофильтр по вертикали gling Microsoft Office Excel 0 04.05.2010 23:17
Склеить таблицы в книге расположив по вертикали. MaxxVer Microsoft Office Excel 4 15.12.2009 09:19
Выравнивание текста по вертикали bowa HTML и CSS 8 20.09.2009 20:34
Как прокрутить ListBox по вертикали? TwiX Общие вопросы Delphi 5 29.07.2009 21:23