WebDesign and Photoshop community

Объявление


Скрепка:

(29.10.08)
Если вам надоело слушать на форумах техподдержки "Учите CSS" или "Пользуйтесь поиском где то это есть", то обращайтесь в тему помощь в CSS, всегда поможем чем сможем.


(28.10.08)
После долговременного ожидания сайт InAStudio открыт и ждет вас на своих страничках! Приношу глубочайшие извинения, ранее зарегистрированным на нем участникам придется пройти регистрацию еще раз. Уверяю больше этого не повторится, и бэкап базы данных будет проводиться впредь регулярно во избежании таких проблем.


(17.10.08)
Темы "Аватар", "Юзербар", "Баннер" закрыты. Больше бесплатных заказов не будет. Причины: 1. большие требования для бесплатного, 2. я не успеваю. Те заказы, которые уже приняты будут выполнены.


(16.10.08)
Приносим извинения за неудобства и долговременное ожидание выполнения заказов. Выполнялся оплаченный заказ. Ведь если человек платит, то не пристало заставлять его долго ждать верно? А так же возникли проблемы с софтом, так как сервер, через которые скачивались программы изменил ключевые ссылки. Ведется работа по восстановлению. И во избежании повторения этой ситуации более переводящими серверами пользоваться не будем



(14.10.08)
Завершена работа над стилем Star Wars. Скриншоты и код самого стиля выложены в теме Стили для форумов.


(13.10.08)
Произведено небольшое пополнение каталога программ. Добавления внесены (и будут вноситься) в конце разделов, то есть смотреть на последних страницах.


(13.10.08)
Закончены работы над галереей, в которой вы можете посмотреть аватары, сделанные на нашем форуме. В планах организация в ней коллекции обоев для рабочего стола
(планируется на конец октября - начало ноября)


(13.10.08)
Ведется работа над гостевой книгой, которая вскоре будет добавлена.
(планируется на 15-16 октября)


Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » WebDesign and Photoshop community » Для новичков » Таблица.


Таблица.

Сообщений 1 страница 30 из 33

1

Формирование таблицы:
Таблица формируется тегом <table>, у которого, как и у большинства тегов есть закрывающий </table>, он является обязательным для правильного отображения таблицы. Как известно таблица делится на ячейки, которые формируются строками(<tr>) и столбцами(<td>), закрывающие теги </td> и </tr> также обязательны. Следует заметить, что столбцы размещаются в строках и ни в коем случае не наоборот.
Таблица состоящая из одной ячейки:

Код:
<table>
<tr>
<td>
Здесь содержимое
</td>
</tr>
</table>

Выглядеть будет она так:

Здесь содержимое

Чтобы сформировать таблицу состоящую из двух ячеек, находящихся на одной строке, внутрь строки <tr> добавляем еще один столбец <td>.
Получаем такой код:

Код:
<table>
<tr>
<td>
Здесь содержимое 1й ячейки
</td>
<td>
Здесь содержимое 2й ячейки
</td>
</tr>
</table>

Внешний вид:

Здесь содержимое 1й ячейки

Здесь содержимое 2й ячейки

Чтобы добавить еще одну строку, добавляем ее сразу после закрытия первой (тега </tr>). То есть получаем:
Таблица состоящая из двух строк и двух столбцов:

Код:
<table>
<tr>
<td>
Здесь содержимое 1й верхней ячейки
</td>
<td>
Здесь содержимое 2й верхней ячейки
</td>
</tr>
<tr>
<td>
Здесь содержимое 1й нижней ячейки
</td>
<td>
Здесь содержимое 2й нижней ячейки
</td>
</tr>
</table>

Внешний вид:

Здесь содержимое 1й верхней ячейки

Здесь содержимое 2й верхней ячейки

Здесь содержимое 1й нижней ячейки

Здесь содержимое 2й нижней ячейки

Далее в этой же теме объясню как сформировать таблицу из одной ячейки сверху и двух снизу, или 1й слева и двух справа. Расскажу про атрибуты, такие как фон или толщина и цвет границ таблицы. А пока советую оторваться от монитора и налить себе чашечку кофе, что я сейчас и сделаю :)

2

Мне понравилось про чашечку кофе... :cool:

3

Спасибо. Сама только не давно разобралась с этим зверем, как таблица. :D
А кофе поздновато уже пить)

4

Ну а мне в самый раз кофейка хлебнуть  :)

5

Ну что же далее. Таблицы обладают следующими атрибутами:
border - граница, обозначает ее толщину;
bordercolor - задает цвет границ;
width - задает ширину таблицы, как в пикселях, так и в процентах;
height - аналогично, задает высоту;
bgcolor - цвет фона таблицы (сам цвет задается либо в формате RGB, либо латинским названием цвета), есть еще задающие цвета темной и светлой стороны, но они не кроссбраузерны, посему давать не буду;
background - задает определенный рисунок в качестве фона;
align - расположение элементов внутри таблицы, может принимать 5 значений: top, center, left, right, justify;
cellpading - отступ до текста внутри ячейки
cellspacing - зазор между ячейками таблицы

6

Нередко нужно чтобы в таблице количество ячеек одной строки было больше чем на другой или дну ячейку разбить на две строки. Можко конечно внутрь ячейки вставлять еще одну таблицу, но это не всегда рационально.
Достигается это с помощью таких параметров ячейки, как rowspan и colspan.
rowspan - делит ячейку на две и более строк;
colspan - делит ячейку на два и более столбцов.
например делаем таблицу состоящую из двух строк, верхняя будет состоять из одной ячейки, а нижняя разделена на 2.

Код:
<table>
<tr>
<td colspan=2>Содержимое верхней ячейки</td>
</tr>
<tr>
<td>Содержимое 1й нижней ячейки</td>
<td>Содержимое 2й нижней ячейки</td>
</tr>
</table>

Если разбиение идет не на 2, а более, то задаем colspan=n
Где n - требуемое количество.
С параметром rowspan аналогично:

Код:
<table>
<tr>
<td rowspan=2>Содержимое верхней ячейки</td>
</tr>
<tr>
<td>Содержимое 1й нижней ячейки</td>
<td>Содержимое 2й нижней ячейки</td>
</tr>
</table>

Только в этом случае получаем не одну сверху и две снизу, а одну слева и две справа.

7

Diesel, я хочу попросить тебя об одолжении, ты не знаеш как сделать чтото вроде боковой таблицы как на Playw.ru, там с правой стороны от содержимого на главной страницы стоит таблица, вот как сделать тоже самое на другом сайте

8

В html-низ суй

<script type="text/javascript">
var news = new Array ()
news.push(new Array("Заголовок", "Новость"))
news.push(new Array("Заголовок2", "Новость2"))

var mynews = "";
for (q=0; q<news.length; q++){
mynews += "<div class='container' style='padding:8px'><h2><center>"+news[q][0]+"</center></h2>"+news[q][1]+"</div><br /><br />";
}
var block=mynews;
var arr=document.getElementsByTagName("div")
i=0
str=document.URL
while(arr[i] ){
if((str.substring(str.lastIndexOf('/')+1)=="" || str.substring(str.lastIndexOf('/')+1)=="index.php") && arr[i].className=="main"){
name=arr[i].innerHTML
name=name.substring(0)
arr[i].innerHTML="<table><tr><td width=20% valign=top>"+block+"</td><td width=80%>"+name+"</td></tr></table>"
}
i++
}
</script>

То что синим размножаешь сколько надо раз

9

Diesel написал(а):

В html-низ суй

СПАСИБОООООООООООООО!!!! :cool:

10

А как в боковую таблицу вставить на пример опрос

Код:
<!-- Begin OPROS2000 Form --><script language="JavaScript"><!-- function opros_result49651() { window.open("http://opros.nodex.ru/2000/fast-cgi-bin/opros.fcgi?empty","result_window49651", "scrollbars=no,status=no,resizable=yes,toolbar=no,directories=no,menubar=no,width=600,height=300") } // --></script><p>Нравится ли Вам наш сайт?</p><form method="get" action="http://opros.nodex.ru/2000/fast-cgi-bin/opros.fcgi" name="opros" target="result_window49651" OnSubmit="opros_result49651()"><input type="radio" name="rb" value="376982" unchecked>
Да<br>
<input type="radio" name="rb" value="376983" unchecked>
Нет<br>
<input type="radio" name="rb" value="376984" unchecked>
Не знаю<br>
<input type="hidden" name="id" value="49651">
<input type="submit" value="Submit">
</form>
<!-- End OPROS2000 Form -->

11

Нужно:
1. Разделить, сам скрипт отдельно, а форму с опросом вставить в таблицу.
2. Во вставляемой форме убрать все переносы на новую строку и кавычки.
Тоесть вот это суй в html-верх:

Код:
<script language=JavaScript>
<!-- function opros_result49651() { window.open(http://opros.nodex.ru/2000/fast-cgi-bin/opros.fcgi?empty, result_window49651, scrollbars=no,status=no,resizable=yes,toolbar=no,directories=no,menubar=no,width=600,height=300) } // -->
</script>

А вот это:

Код:
<p>Нравится ли Вам наш сайт?</p><form method=get action=http://opros.nodex.ru/2000/fast-cgi-bin/opros.fcgi name=opros target=result_window49651 OnSubmit=opros_result49651()><input type=radio name=rb value=376982 unchecked>Да<br><input type=radio name=rb value=376983 unchecked>Нет<br><input type=radio name=rb value=376984 unchecked>Не знаю<br><input type=hidden name=id value=49651><input type=submit value=Submit></form>

В скрипт  боковой таблицы, туда где новость.

Надеюсь понятно объяснил)) Если что спроси

12

Всё работает!

13

Diesel, а можно мне заказать,сделать таблицу не большую а наоборот из моей (ты ее видел у меня на форуме) сделать вариант меньше,если можно я нарисую какую.

14

Санек написал(а):

Diesel, а можно мне заказать,сделать таблицу не большую а наоборот из моей (ты ее видел у меня на форуме) сделать вариант меньше,если можно я нарисую какую.

Рисуй))

15

Diesel,
Пасиб за нужную информацию=)

16

Санек

Рисуй быстрее!

Diesel

Можно я попробую сделать эту таблицу, пожааааалуста!? :rolleyes:

Отредактировано Stranger2512 (2008-10-22 05:58:10)

17

Stranger2512 написал(а):

Можно я попробую сделать эту таблицу, пожааааалуста!? :rolleyes:

Делай конечно :)

18

Diesel,
привет!!!Диз вот такой вопрос  вот моя таблица http://s57.radikal.ru/i157/0810/23/c5e4df7f748c.jpg Можно ее сделать норм подровять и на задний фон сделать таким потертым как бы))и Шрифт чтобы был Comic Sans MS и заголовки были красного цвета,а текст в таблице синего=)Жирный))Зарание спс=) http://kolobok.us/smiles/standart/pardon.gif Просто делаю делаю и нефига не получаеться!!! http://kolobok.us/smiles/standart/cray.gif Выручи плз=) http://www.kolobok.us/smiles/artists/just_cuz/JC_ThankYou.gif

19

Diesel,
А вот еще диз задиний фон моно сереньким ближе к темному сделать??=)Зарние спс=)

20

Код:
<table border="1" align="center" width="100%" >
<tr > 
<td  colspan="3"><marquee>Добро пожаловать на наш САЙТ!!!!Мы будм надеяться,что вам у нас понравиться!!!!=)С уважением АДмининстрация.</marquee></td>
</tr>
<tr  > 
<td rowspan="2" height="501" width="481"><img src="http://s49.radikal.ru/i126/0810/e5/5e752b1520d8.jpg"></td>
<td align=center >К прочтению:<br>
<br><a href="http://fornoobs.0pk.ru/viewtopic.php?pid=35#p35">...::Правила::...</a></td>
<td  >События игры: Один из старейших ММО-проектов, RF Online, готовится покинуть европейский и американский рынки. Представители компании Codemasters, владеющей правами на издание и поддержку игры в этих частях света, сообщили, что им не удалось договориться с разработчиками о продлении лицензии.

    Причины Codemasters не сообщает, но итог будет печален для всех поклонников RF Online – с 9 ноября этого года сервера игры в Северной Америке и Европе будут отключены.</td>
</tr>
<tr  > 
<td colspan="5">Новости:Пока пусто))</td>
</tr>
<tr  > 
<td  >Календарь новостей<br>
2008-2009 год с 1 ноября.<br> </td>
<td  ><font size="2" color=LightGoldenrod4 face="Times New Roman"><b><u>ПОЛЕЗНЫЕ ССЫЛКИ:</u></b></font><br>
    <br>
    <a href= http://www.zaycev.net/><font size="2" face=" Book Antiqua "><b>Полный сайт песен</b> </font></a>
    <br>
    <a href= http://www.igromania.ru/><font size="2" face=" Book Antiqua "><b>ИГРОМАНИЯ</b> </font></a>
    <br>
    <a href= http://www.chemax.ru/><font size="2" face=" Book Antiqua "><b>КОды и тд тут</b> </font></a><br>
    <a href= http://fornoobs.0pk.ru/viewforum.php?id=13><font size="2" face=" Book Antiqua "><b>Объявления администрации</b> </font></a><br></td>
</tr>
<tr  > 
<td ><font color=red><font size="5" color=Firebrick face=" Monotype Corsiva "><b><u>Администрыторы:</u></b></font><br><font size="5" face="Comic Sans MS"><b><a href= http://fornoobs.0pk.ru/profile.php?id=2><font size="2" face=" Book Antiqua "><b>King]NooB[</b> </font></b><br>
<font color=blue>Модераторы:</u></b></font><br><font size="5" face="Comic Sans MS"><b><a href= http://fornoobs.0pk.ru/profile.php?id=6><font size="2" face=" Book Antiqua "><b>Soulblade</b> </font></a> </div></font></td>
<td  >Реклама:Сдесь может быть ваш баннер=)</td>
<td  >Для гостей:Просьба региться!!!!=)</td>
</tr>
</table>

совсем забыл вот код моей таблицы))

21

King]NooB[, по поводу фона это надо тебе рисунок найти подходящий. Посмотри вот тут http://lenagold.ru/fon/main.html я всегда там фоны беру)) А текст сейчас сделаю.

22

Diesel,
оке спс=)ПРивет кстати!!Я тя так долго не видел!!!! http://www.kolobok.us/smiles/user/Mauridia_21.gif

23

Привет)) Как фон подберешь скинь его сюда, я тебе его всуну в таблицу

24

Diesel,
воть http://s54.radikal.ru/i144/0810/c3/9694b05002c5t.jpg

25

ок

26

Код:
<style>#tableRFO {font-family: Comic Sans MS; color: white;}</style>
<table border="1" align="center" width="100%" ID="tableRFO" background="http://s48.radikal.ru/i122/0810/38/ba69bc90372f.jpg">
<tr > 
<td  colspan="3">
<marquee>Добро пожаловать на наш САЙТ!!!!Мы будм надеяться,что вам у нас понравиться!!!!=)С уважением АДмининстрация.</marquee>
</td>
</tr>
<tr  > 
<td rowspan="3" height="501" width="481">
<img src="http://s49.radikal.ru/i126/0810/e5/5e752b1520d8.jpg">
</td>
<td align=center >
<font color=red>К прочтению:</font>
<br>
<br><a href="http://fornoobs.0pk.ru/viewtopic.php?pid=35#p35">...::Правила::...</a>
</td>
<td rowspan=2>
<font color=red>События игры:</font> <br>
<div align="justify">Один из старейших ММО-проектов, RF Online, готовится покинуть европейский и американский рынки. Представители компании Codemasters, владеющей правами на издание и поддержку игры в этих частях света, сообщили, что им не удалось договориться с разработчиками о продлении лицензии.

    Причины Codemasters не сообщает, но итог будет печален для всех поклонников RF Online – с 9 ноября этого года сервера игры в Северной Америке и Европе будут отключены.</div>
</td>
</tr>
<tr>
<td  >
<font color=red>ПОЛЕЗНЫЕ ССЫЛКИ:</font><br>
    <br>
    <a href= http://www.zaycev.net/><font size="2" face=" Book Antiqua "><b>Полный сайт песен</b> </font></a>
    <br>
    <a href= http://www.igromania.ru/><font size="2" face=" Book Antiqua "><b>ИГРОМАНИЯ</b> </font></a>
    <br>
    <a href= http://www.chemax.ru/><font size="2" face=" Book Antiqua "><b>КОды и тд тут</b> </font></a><br>
    <a href= http://fornoobs.0pk.ru/viewforum.php?id=13><font size="2" face=" Book Antiqua "><b>Объявления администрации</b> </font></a><br>
</td>
</tr>
<tr  > 
<td colspan="2">
<font color=red>Новости:</font><br>Пока пусто))
</td>
</tr>
<tr  > 
<td >
<font color=red><u>Администраторы:</u></font><br><font size="5" face="Comic Sans MS"><b><a href= http://fornoobs.0pk.ru/profile.php?id=2><font size="2" face=" Book Antiqua "><b>King]NooB[</b> </font></b></a><br>
<font color=blue>Модераторы:</u></b></font><br><font size="5" face="Comic Sans MS"><b><a href= http://fornoobs.0pk.ru/profile.php?id=6><font size="2" face=" Book Antiqua "><b>Soulblade</b> </font></a> </div></font></td>
<td rowspan=2><font color=red>Реклама:</font><br>Здесь может быть ваш баннер=)</td>
<td rowspan=2><font color=red>Для гостей:</font><br>Просьба региться!!!!=)</td>
</tr>
<tr  > 
<td  >
Календарь новостей<br>2008-2009 год с 1 ноября.<br> 
</td>
</tr>
</table>

King]NooB[, если синим шрифтом, то вообще ничего не видно, по этому сделал белым, но если тебе всетаки нужен синий, то смотри самую первую строчку

<style>#tableRFO {font-family: Comic Sans MS; color: white;}</style>

color: white замени на color: blue

27

Diesel,
Белый супер!!!!Диз я тебя люблю!!!! http://www.kolobok.us/smiles/artists/vishenka/d_turn.gif

28

Чур я без косичек http://kolobok.us/smiles/standart/rofl.gif

29

Diesel,
Ах вот мы как))))Ну ладно!!!Это песня для тебя!!!! http://www.kolobok.us/smiles/artists/laie/Laie_3.gif

30

Кхм,  вобщем вот можно зделать мне такую таблицу, знаю простая но всеже профессиональная рука лучше :)

http://s61.radikal.ru/i174/0810/53/0d2ee74f71af.jpg

и еще вставьте в нее все содержимое, плиз:

1) Где написано лого, туда соответственно логотип вот этот - http://i025.radikal.ru/0809/c9/5605a2b9ec6e.jpg

2) В левый столбик от логотипа вот этот текст

=У нас на форуме= ( зеленым цветом )

Рэп и хип-хоп обоев - 90 ( ВСЕ ЭТИ КРАСНЫМ)
Интервью - 44                 
Биографий - 56               
Фото рэперов - 150
Альбомов - 20
Клипов - 4

3) в правый от логотипа вот эти слова: тАКИМИ ЖЕ ЦВЕТАМИ КАК И СЕЙЧАС. бУДУ ОЧЕНЬ БЛАГОДАРЕН

Для того чтобы скачать: обои, клипы, альбомы…Нужна регистрация на нашем форуме.[color=maroon]Гости, регистрируйтесь, и вы будите полноценными участниками форума.


Вы здесь » WebDesign and Photoshop community » Для новичков » Таблица.


Рейтинг форумов | Создать форум бесплатно