Хостинг серверов Minecraft playvds.com
  1. Вы находитесь в русском сообществе Bukkit. Мы - администраторы серверов Minecraft, разрабатываем собственные плагины и переводим на русский язык плагины наших собратьев из других стран.
    Скрыть объявление

Совет Учимся основам html

Тема в разделе "Руководства, инструкции, утилиты", создана пользователем second_vynder, 28 июл 2013.

  1. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder
    Итак, приступим. HTML не требует интерпретатора, а значит работать с ним можно везде, оборудования для функционирование не нужно (ну, понадобится только компьютер).
    Структура HTML:
    HTML:
    <html>
<head>
<title>Тест</title>
</head>
<body>
Тест текста
</body>
</html>
    Рассмотрим подробнее:
    Все что между "<" и ">" - теги. Закрытие тега осуществляется добавлением в начало тега слеша. Пример: <тег>текст внутри тега</тег>
    Тег <html> отвечает за начало текста с языком html.
    Тег <head> отвечает за "системные" настройки страницы, так, например, внутри него подключаются файлы, настраивается кодировка, иконка страницы или "шапка" страницы.
    Тег <body> отвечает за "тело" страницы, то есть содержит весь текст, картинки, иначе говоря - содержание.
    Далее мы видим закрытые тегов.
    Попробуйте скопировать текст выше и создать файл test.html, откройте его в браузере. В левом верхнем углу должно быть "Тест текста". Согласитесь, что выглядит не очень? Исправим! Для начала стоит сделать оцентровку - тег <center>. Добавим в тег <body> тег <center> между "Тест текста", закроем текст перед закрытием </body>. Получится следущее:
    HTML:
    [/COLOR][/COLOR]<body>
<center>Тест текста<center>
</body>
    Обновим страницу - текст должен появится в центре. Дальше попробуем сменить размер текста - теги <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, самый большой шрифт у тега <h1>, самый маленький у тега <h6>. Сделаем текст размера №2:
    HTML:
    <body>
<center>
<h2>
Тест текста
</h2>
</center>
</body>
    Теперь уже получше, не правда ли? Идем дальше. Окрасим текст, тут уже будет внутренний стиль CSS, иначе говоря атрибут тега. Добавим атрибут "color" тегу "h2", будет примерно так:
    HTML:
    <h2 color="blue">Тест текста</h2>

    Теперь заметно лучше! А что если нужно написать еще текст на новой строке? И это можно! Для этого используем тег <br>, при этом закрывать его не надо (пример: тест<br>тест). На этом все.
    Задания:    Сделать заголовок красного цвета, а под ним зеленый текст размера №5.
     
    second_vynder, 28 июл 2013
    #1
    2. Хостинг MineCraft
    <
  2. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder
    Сегодня продолжим форматирование текста. Итак, снова вернемся к тегам:
    <b> - выделение текста в жирный.
    <i> - выделение текста в курсив.
    <u> - подчеркивание текста.
    <abb> - очень интересный тег с атрибутом "title", выделяет текст подчеркиванием, а при наведение курсора на текст с таким тегом выводит текст из атрибута.
    <code> - тег, который вам не скорее всего не понадобится, но его следует знать. Выводит текст как код (выделяет в рамку).
    <s> - зачеркивает текст.
    С этими тегами все понятно, как пользоваться ими вы догадаетесь. Рассмотрим лучше тег <hr>, с атрибутами color, size, noshade, widht, align. Этот тег делает линию. Рассмотрим его на примере:
    HTML:
    <hr>


    Серая линия в 1 пиксель через весь экран. Не очень красиво, правда?

    HTML:
    <hr align="center" size="10" color="pink" width="70%">


    Выведет красивую жирную линию в 10 пикселей в центре монитора.
    Еще есть тег <pre>, он позволяет вывести текст "как есть", то есть если 20 пробелов между слов - будут все 20 пробелов, а не 1 везде (то есть без этого тега текст в любом теге можно разделить только одним пробелом, два-три и так далее пробела сольются в один).
    Ну и если вы будете работать с математическими выражениями - помогут теги <suB> и <suP>, выводящие текст в разных регистрах (если вы возводите текст в дробь, например).
    А в заключение - пример со всеми тегами:




    HTML:
    <html>
<head>
<title>Все теги в уроке</title>
</head>
<body>
<b>Жирный B</b>
<i>Курсив I</i>
<u>Подчеркнутый U</u>
<s>Зачеркнутый S</s>
<abb title="С тегом title">Текст с ABB</abb>
<code>Код CODE</code>
<hr align="center" size="10" color="pink" widht="70%">
<pre>Тег                                                              PRE<pre>
H<sup>2</sup>O
x<sub>10</sub>
</body>
</html>
     
    second_vynder, 28 июл 2013
    #2
    Kela-4D нравится это.
  3. Angel of death

    Angel of death Активный участник

    Баллы:
    88
    Имя в Minecraft:
    PHP_mysql_css_html
    @second_vynder,Не упусти главного div,header,footer.[DOUBLEPOST=1375096460,1375096353][/DOUBLEPOST]<div id="id = это идентификатор css стилей применяемых только на один блок данных"></div>
    <div id="class = это класс css стилей применяемые на многоразовые блоки div данных"></div>
     
    Angel of death, 29 июл 2013
    #3
  4. d3lour

    d3lour Старожил Пользователь

    Баллы:
    123
    Имя в Minecraft:
    d3lour
    Ужас! Ты учишь говнокодить.
     
    d3lour, 29 июл 2013
    #4
    zivgta, Nupke, Angel of death и 3 другим нравится это.
  5. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder
    Во-первых, я не учу говнокоду.
    Во-вторых, чему учишь ты?
     
    second_vynder, 29 июл 2013
    #5
    Сникерсни, slavik123123123 и Teozard нравится это.
  6. d3lour

    d3lour Старожил Пользователь

    Баллы:
    123
    Имя в Minecraft:
    d3lour
    Код:
     <html>
<head>
<title>Тест</title>
</head>
<body>
Тест текста
</body>
</html>
    1. Не указан тип документа
    2. Не указана кодировка
    3. Текст сразу в body - не совсем правильно
    Код:
    <center>Тест текста<center>
    Этот тег не входит в стандарты, его использование не рекомендуется

    Код:
    <h2 color="blue">Тест текста</h2>
    Стили лучше прописывать в самом файле со стилями. Но если нужно единоразово и уж так лень, то можно и так[DOUBLEPOST=1375103527,1375103461][/DOUBLEPOST]Еще урок верстки на таблицах сделай. Прошлый век

    Если уж так хочется учить, то лучше заглянуть на http://htmlbook.ru/
     
    d3lour, 29 июл 2013
    #6
    AlexMerser, DimasForce, ZloYCRipeeR и ещё 1-му нравится это.
  7. DimasForce

    DimasForce Старожил Пользователь

    Баллы:
    173
    Имя в Minecraft:
    DimasForce
    Это случайно не Л.В. Широкова косит под пацана? А то сильно напоминает мануалы, по которым я в 5 классе учился.
     
    DimasForce, 29 июл 2013
    #7
    ВремяПриключений, second_vynder и Angel of death нравится это.
  8. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder

    О-о, ты меня раскусил! Кто эта тетка? Чего она великого сделала? В мое время ее не изучали.
     
    second_vynder, 30 июл 2013
    #8
  9. DimasForce

    DimasForce Старожил Пользователь

    Баллы:
    173
    Имя в Minecraft:
    DimasForce
    @second_vynder, на счет великого не знаю, но это мой преподаватель информатики с 5 по 9 класс.
     
    DimasForce, 30 июл 2013
    #9
  10. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder

    Ну значит тутор с пометкой "10-, присутствуют непонятные моменты."
     
    second_vynder, 31 июл 2013
    #10
    I-Am-Black-Overlord нравится это.
  11. AvengeRkaa

    AvengeRkaa Старожил

    Баллы:
    123
    Имя в Minecraft:
    AvengeRkaa
    Следует добавить, что код внутри тега code не парсится и отображается как обычный текст.

    Простите, што?
     
    AvengeRkaa, 31 июл 2013
    #11
    alden нравится это.
  12. Teozard

    Teozard Активный участник Пользователь

    Баллы:
    93
    Имя в Minecraft:
    Teozard
    А нам в институте именно так и начинали объяснять, а знаете почему? Потому, что тот кто только начинает вникать в суть работы, это в начале знать не обязательно, оно должно рассказываться после осознания что такое теги, как оно работает, как работают стили и так далее. Замечания справедливые, особенно про центр. Между прочим зря вы так про верстку на таблицах, нас заставили сделать пару демо страниц в таком стиле, чтобы мы полностью осознали насколько проще работать с div, это как минимум интересно.

    Я и сам планирую сделать небольшой курс по html, не тут правда
     
    Teozard, 31 июл 2013
    #12
    d3lour нравится это.
  13. d3lour

    d3lour Старожил Пользователь

    Баллы:
    123
    Имя в Minecraft:
    d3lour
    НО что сложного в h1-h6, b, s и т.д? Это же простое форматирование текста
     
    d3lour, 31 июл 2013
    #13
    МиднайтЖелаетВамДобра и MineMan910 нравится это.
  14. Teozard

    Teozard Активный участник Пользователь

    Баллы:
    93
    Имя в Minecraft:
    Teozard
    Так ведь речь не об этом, а то, что не стоит сразу пугать человека, который только только начал, не понятными терминами вроде файл стилей и указание кодировки, он, если человеку интересно, узнает об этом со временем.
     
    Teozard, 31 июл 2013
    #14
    second_vynder и DixyOxx нравится это.
  15. PoMi4

    PoMi4 Активный участник

    Баллы:
    78
    Skype:
    ddiddmmorrozz
    Имя в Minecraft:
    PoMi4
    Не знаю как вы, но я учился тут. На этом сайте: коротко, строго и главное понятно!
     
    PoMi4, 31 июл 2013
    #15
  16. zivgta

    zivgta Старожил Пользователь

    Баллы:
    123
    Имя в Minecraft:
    TheThomas
    Это похоже на говнокод: <abb title="С тегом title">Текст с ABB</abb> (нафиг он кому-то нужен?)
    А вот тут помимо говно кода без стилей вы еще и ошибки в коде допустили: <hr align="center" size="10" color="pink" widht="70%"> - widTH
     
    zivgta, 31 июл 2013
    #16
  17. Автор темы
    second_vynder

    second_vynder Старожил Пользователь

    Баллы:
    153
    Skype:
    my.nik.vynder
    Я не учу же всем нюансам HTML, в заголовке темы сказано про основы, что-то я там нигде не увидел полного курса.... Всем было бы полезно знать хотя-бы как сделать надпись вроде "Сайт в отключенном состоянии, настраиваем CMS". По-поводу ошибки - исправил.
    Про кодировки и стили - блеснуть умом решили? Teozard правильно сказал про то что если человек заинтересуется - узнает. А я ознакомил с возможностями, остальное дело рук специализированных сайтов.
     
    second_vynder, 31 июл 2013
    #17
  18. d3lour

    d3lour Старожил Пользователь

    Баллы:
    123
    Имя в Minecraft:
    d3lour
    Ознакомил с возможностями? ._.
     
    d3lour, 31 июл 2013
    #18

Поделиться этой страницей