-Цитатник

Шпору вылечила за 3 дня. Лечение народными средствами - (0)

Шпору вылечила за 3 дня Поделюсь рецептами от пяточных шпор. Про­шлым летом на юге после...

Рамочки для записей от Arnusha - (2)

...Здесь будет ваша запись... ...Здесь будет ваша запись... ...Здесь будет ваша запись...

AnVir Task Manager 7.5.2 - обалденная чистилка компьютера! - (0)

AnVir Task Manager — бесплатная системная утилита, которая позволяет контролировать все, что зап...

Сообщество Questions_LiveInternet - Вопросы по Лиру - (0)

Сегодня я хочу представить вам новое Сообщество, в котором вы можете задавать свои вопросы,...

Поём под караоке - (0)

Здравствуйте... Сегодня урок для тех, кто любит петь...)) Есть интересный сайт, где под ка...

 -Приложения

  • Перейти к приложению Открытки ОткрыткиПерерожденный каталог открыток на все случаи жизни
  • Перейти к приложению Всегда под рукой Всегда под рукойаналогов нет ^_^ Позволяет вставить в профиль панель с произвольным Html-кодом. Можно разместить там банеры, счетчики и прочее
  • Перейти к приложению Онлайн-игра "Empire" Онлайн-игра "Empire"Преврати свой маленький замок в могущественную крепость и стань правителем величайшего королевства в игре Goodgame Empire. Строй свою собственную империю, расширяй ее и защищай от других игроков. Б
  • Перейти к приложению Виджет "Позитивное Настроение" :) Виджет "Позитивное Настроение" :)Друзья! Всем, у кого есть свой Cайт, предлагаю установить на него Виджет Позитивного Настроения. Установка займет всего несколько минут, а запаса позитивного настроения для посетителей Вашего сайта хв
  • Музыкальный плеер

 -Всегда под рукой

 -Поиск по дневнику

Поиск сообщений в Babiki

 -Подписка по e-mail

 


Как расположить несколько элементов на страничке рядом друг с другом.Урок для начинающих!

Понедельник, 06 Декабря 2010 г. 04:44 + в цитатник
Цитата сообщения Arnusha
Когда я только начинала изучать как и многие из вас все детали,что такое NTML-коды,как ставить,где ставить-возникало много вопросов и ведь каждый раз требовались ответы на них.Я сама столкнулась и ещё столкнусь уверена,что бывает нужно спросить и не у кого...Как неохотно отвечают на вопросы новичков уже "повзрослевшие" пользователи,как будто и сами не были чайниками.Нет времени и это понятно.Ведь нужно всё разжевать и понятным языком объяснить,куда,как и для чего... Многие не знают Как расположить несколько элементов на страничке рядом друг с другом.Например,как выставить рядом картинки,смайлики или снежинки...Я тоже раньше не могла и спрашивать было некого,лишний раз не хотела раздражать своими вопросами.Сегодня я попробую вам объяснить,как это делать и с помощью чего...Первые шаги так сказать для начинающих,кто только начал делать шаги в области постов с картинками
ИТАК ПОЕХАЛИ:

Пока я знаю только два способа,которые подходят для картинок, флешек, часиков, линеечек и так далее
Первый способ: МЕЖДУ КОДАМИ ДВУХ КАРТИНОК ВСТАВЬТЕ НЕРАЗРЫВНЫЙ ПРОБЕЛ  
ПРИМЕР:<код первой кнопки>&nbsp;<код второй кнопки>&nbsp;<код третьей кнопки>
  
 
Но учтите: этот способ не работает, если вы хотите поставить что-то рядом с табличкой.Например,под картинкой поставить код.

Второй способ намного сложнее:
Ниже я выложила коды табличек,так же вы можете сами их выстраивать.Но для этого нужен ещё один урок.
А пока для примера вот вам работа для размышлений,они помогут вам понять структуру кодов и помогут в работе.
Поехали:
Вот табличка из 2 столбцов и 3 строк
Вот так будет выглядеть расклад ваших картинок или кнопок,состоящих из 2-х столбиков и в три строки.
Первая строка, первый столбец Первая строка, второй столбец
Вторая строка, первый столбец Вторая строка, второй столбец
Третья строка, первый столбец Третья строка, второй столбец
.

Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="text-align: center;" valign="undefined">Первая строка, первый столбец</td> <td style="text-align: center;" valign="undefined">Первая строка, второй столбец</td> </tr> <tr> <td style="text-align: center;" valign="undefined">Вторая строка, первый столбец</td> <td style="text-align: center;" valign="undefined">Вторая строка, второй столбец</td> </tr> <tr> <td style="text-align: center;" valign="undefined">Третья строка, первый столбец</td> <td style="text-align: center;">Третья строка, второй столбец</td> </tr> </tbody> </table>

Вот что получилось у меня...

************************************************
Табличка из 3 столбцов и 3 строк
Первая строка, первый столбец Первая строка, второй
столбец
Первая строка, третий столбец
Вторая строка, первый столбец Вторая строка, второй столбец Вторая строка, третий столбец
Третья строка, первый столбец Третья строка, второй столбец Третья строка, третий столбец


Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="text-align: center;" valign="undefined">Первая строка, первый столбец</td> <td style="text-align: center;">Первая
строка, второй столбец</td> <td style="text-align: center;" valign="undefined">Первая строка, третий столбец</td> </tr> <tr> <td style="text-align: center;" valign="undefined">Вторая строка, первый столбец</td> <td style="text-align: center;" valign="undefined">Вторая строка, второй столбец</td> <td style="text-align: center;" valign="undefined">Вторая строка, третий столбец</td> </tr> <tr> <td style="text-align: center;" valign="undefined">Третья строка, первый столбец</td> <td style="text-align: center;" valign="undefined">Третья строка, второй столбец</td> <td style="text-align: center;" valign="undefined">Третья строка, третий столбец</td> </tr> </tbody> </table>Табличка из 4 столбцов и 3 строк
Первая строка, первый столбецПервая строка, второй столбецПервая строка, третий столбецПервая строка, четвёртый столбец
Вторая строка, первый столбецВторая строка, второй столбецВторая строка, третий столбецВторая строка, четвёртый столбец
Третья строка, первый столбецТретья строка, второй столбецТретья строка, третий столбецТретья строка, четвёртый столбец

Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="text-align:
center;" valign="undefined">Первая строка, первый столбец</td><td style="text-align: center;">Первая строка, второй столбец</td><td style="text-align: center;" valign="undefined">Первая строка, третий столбец</td><td style="text-align: center;" valign="undefined">Первая строка, четвёртый столбец</td></tr><tr><td style="text-align: center;" valign="undefined">Вторая строка, первый столбец</td><td style="text-align: center;" valign="undefined">Вторая строка, второй столбец</td><td style="text-align: center;" valign="undefined">Вторая строка, третий столбец</td><td style="text-align: center;" valign="undefined">Вторая строка, четвёртый столбец</td></tr><tr><td style="text-align: center;" valign="undefined">Третья строка, первый столбец</td><td style="text-align: center;" valign="undefined">Третья строка, второй столбец</td><td style="text-align: center;" valign="undefined">Третья строка, третий столбец</td><td style="text-align: center;" valign="undefined">Третья строка, четвёртый столбец</td></tr></tbody></table>

******************************************
Табличка из 2 столбцов и 1 строки
Первая строка, первый столбецПервая строка, второй
столбец


Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="text-align: center;" valign="undefined">Первая строка, первый столбец</td><td style="text-align: center;">Первая строка, второй столбец</td></tr></tbody></table>

*****************************************
Табличка из 3 столбцов и 1 строки
Первая строка, первый столбецПервая строка, второй столбецПервая строка, третий столбец

Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="text-align: center;" valign="undefined">Первая строка, первый столбец</td><td style="text-align: center;"
valign="undefined">Первая строка, второй столбец</td><td style="text-align: center;">Первая строка, третий столбец</td></tr></tbody></table>

******************************************
Табличка из 4 столбцов и 1 строки
Первая строка, первый столбецПервая строка, второй столбецПервая строка, третий столбецПервая строка, четвёртый столбец

Вот код этой таблицы
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="text-align: center;" valign="undefined">Первая строка, первый столбец</td><td style="text-align: center;">Первая
строка, второй столбец</td><td style="text-align: center;" valign="undefined">Первая строка, третий столбец</td><td style="text-align: center;" valign="undefined">Первая строка, четвёртый столбец</td></tr></tbody></table>

*************************************
Вот то,чем я сама пользуюсь.Хочу подчеркнуть для тех кто будет применять эти коды в работе:очень осторожно и внимательно.Работа кропотливая и кто уже сталкивался с ними,тот знает.Я отключаюсь полностью,никакого ТВ,потому что малейшая ошибка и всё надо будет начинать заново.Это касается тех,кто будет выставлять свои работы с кодами.Если кому-то что-то не понятно или какие-то трудности,пишите,я обязательно отвечу.И желательно в личку,отвечу обязательно..Особая благодарность клубу Не хочу быть "чайником"!.Только заходя туда и читая в одиночку и методом тыка я освоила эти таблицы,спасибо Диане.
Ещё один момент,если выставляете много картинок,линеек,разделителей,то понятно,что нужно использовать код несколько раз.
Удачив всем!!!

Серия сообщений "▣УРОКИ":
Часть 1 - Полезность для оформления постов
Часть 2 - Как расположить несколько элементов на страничке рядом друг с другом.Урок для начинающих!
Часть 3 - СОЗДАДИМ АРХИВ
Часть 4 - Как создать на рабочем столе ярлык Интернета (сайта)
...
Часть 9 - Красивое разворачивание картинки в постах и рамках
Часть 10 - Урок по дизайну рабочего стола
Часть 11 - Делаем оригинальные рамочки без фонов. Урок от Arnusha!


 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку