моя 1ая работа

stilus · September 3, 2012

Приветствую. Я художник + изучаю photoshop.

Решил сделать себе небольшой сайт. Делаю с нуля в блокноте. Это мой 1 проект.

http://rghost.ru/40171398/image.png моя наработка

http://rghost.ru/40171406/image.png хочу сделать так

Не знаю как перемещать текст, пока использую пробел вида

т.к. сайт простенький и будет в нём примерно 10-15 страниц решил делать его вручную, хороший опыт для меня.

вот как я делаю, да очень топорно вопрос состоит в том, чтобы переместить текст как это сделать?

<html>
 <head>
 <title>Картины, макеты, рекламные апликации, фото, портреты и многое другое</title>
 </head>

<body>
<br>
<center>
<span style="color:999999">S</span>
<span style="color:000000">t</span>
<span style="color:999999">i</span>
<span style="color:000000">l</span>
<span style="color:999999">l</span>
<span style="color:000000">u</span>
<span style="color:999999">s</span>

<br>
<br>
Картины, макеты, рекламные апликации. Наш стиль минимализм. Просто и удобно.
<center/>
<br>
<pre>Услуги     Цены     Контакты     О нас<pre/>






</body>

</html>

Edited September 3, 2012 by stilus

USF · September 3, 2012

никаких пробелов.

текст центрируется через text-align: center;

stilus · September 3, 2012

хорошо, к примеру мне не по центру надо, а немного левее, как поступать?

hedgehog · September 3, 2012

хорошо, к примеру мне не по центру надо, а немного левее, как поступать?

margin, padding, не стесняемся

Меню обычно делают такой структурой: http://jsfiddle.net/AfKTm/

Edited September 3, 2012 by hedgehog

stilus · September 3, 2012

хорошо, к примеру мне не по центру надо, а немного левее, как поступать?
margin, padding, не стесняемся
Меню обычно делают такой структурой: http://jsfiddle.net/AfKTm/

вот это уже что-то спасибо за наводку продолжу свою работу

stilus · September 4, 2012

возник такой вопрос, понял из вашего примера что вы предложил css, я разобрался более менее создал файл .css разместил его в папке с html файлом, но он не работает, может быть это из за того что я просто открываю в браузере?

вот что получается, хотя поидее должно быть посередине

hedgehog · September 4, 2012

Судя по скриншоту - не подключаются стили либо неправильно указан селектор. Без кода не разобраться.

stilus · September 4, 2012

в css файле всё из вашего примера

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>111</title>
  <meta http-equiv="Content-Type" content="text/html; windows-1251">
  <link rel="stylesheet" href="style.css" type="text/css">
 </head>
 <body>
<p class="center">Центр!</p>
<ul class="menu">
    <li><a href="#">Услуги</a></li>
    <li><a href="#">Цены</a></li>
    <li><a href="#">Контакты</a></li>
    <li><a href="#">О нас</a></li>
</ul>
<ul class="menu shift">
    <li><a href="#">Услуги</a></li>
    <li><a href="#">Цены</a></li>
    <li><a href="#">Контакты</a></li>
    <li><a href="#">О нас</a></li>
</ul>
 </body>
</html>

USF · September 4, 2012

судя по всему вас css файл вообще не подвключается.

<link rel="stylesheet" href="style.css" type="text/css">

css файл в той же папке что и страничка?

stilus · September 4, 2012

да

USF · September 4, 2012

но стили не применяются

попробуйте вытащить стили из файла в теги

<style>...</style>

sigma77 · September 4, 2012

stilus,

А покажи как сами стили записаны.

Плюс проверь, что нет опечаток в названии файла, русские символы вместо английский и т.п.

Edited September 4, 2012 by sigma77

stilus · September 4, 2012

заработало в перспективе надо разобраться однозначно с файлом .css, но у меня даже предположений нет в чём дело...

файл назыается style.css сделан в блокноте, сохранить как-выбрал тип "все файлы" и сохранил

Edited September 4, 2012 by stilus

USF · September 4, 2012

офффтоп:

советую скачать программу NotePad++ - отличный редактор, который сильно облегчит работу и с html и с css файлами и не только.

stilus · September 4, 2012

я ей и пользуюсь

hedgehog · September 4, 2012

файл назыается style.css сделан в блокноте, сохранить как-выбрал тип "все файлы" и сохранил

Ясное дело, по умолчанию блокнот сохраняет текстовые документы с расширением .txt, поэтому получался файл style.css.txt

Тут опечатка:

<meta http-equiv="Content-Type" content="text/html; windows-1251">

Нужно так:

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

И кодировку нужно объявлять ДО title.

А еще более правильно делать вот так:

<!DOCTYPE html>
<html lang="ru">
 <head>
  <meta charset="UTF-8">
  <title>111</title>
  <link rel="stylesheet" href="style.css">
 </head>
 <body>
<p class="center">Центр!</p>
<ul class="menu">
    <li><a href="#">Услуги</a></li>
    <li><a href="#">Цены</a></li>
    <li><a href="#">Контакты</a></li>
    <li><a href="#">О нас</a></li>
</ul>
<ul class="menu shift">
    <li><a href="#">Услуги</a></li>
    <li><a href="#">Цены</a></li>
    <li><a href="#">Контакты</a></li>
    <li><a href="#">О нас</a></li>
</ul>
 </body>
</html>

И, соответственно, сохранять файл в кодировке UTF8 без BOM

stilus · September 4, 2012

спасибо, всё заработало, файл .css создал через notepad++, теперь всё ок, по мере работы буду задавать вопросы, благодарен

возникло несколько вопрос по пути..

зачем в начале кода указывают такие строки?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

почему в коде используют разные кодировки?

UTF-8

windows-1251

hedgehog · September 4, 2012

зачем в начале кода указывают такие строки?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

http://htmlbook.ru/samlayout/rezhimy-brauzerov/doktaip

Видеодоклад:

почему в коде используют разные кодировки?
UTF-8
windows-1251

В "эпоху" utf8 сложно представить ситуацию, когда нужна однобайтовая кодировка (вроде cp1251) на веб-странице.

stilus · September 4, 2012

спасибо, видео оказалось простым и информативным, это мне понравилось

В) пойду на доске для всех сотрудников напишу < ! DOCTYPE HTML >

Sign In

моя 1ая работа

Question

Link to comment

Share on other sites

18 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information