На Главную

Форум

1 2 3
  

А теперь вставим картинку на вашу страничку. Скопируйте в туже папку любую картинку или фото (небольшого размера), пусть картинка лежит в той же папке, что и ваш документ. Тогда введём <img src="указываем где лежит картинка"> Например ваша картинка называется kartina.gif и лежит у вас в той же папке, что и документ list.html Значит пишем: <img src=" Первая страничка\kartina.gif "> Если картинка лежит на другом сайте пишем: <img src=" http://astchen2006.narod.ru/Anim5.gif "> Пример: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099"> <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <img src=" http://astchen2006.narod.ru/stroisait/kartinka.gif "> <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Загляните в тэги и посмотрите какие атрибуты подходят к img, выровнять картинку , или например с помощью width="" можно задать другую ширину картинки, пример: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099"> <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <img src=" http://astchen2006.narod.ru/stroisait/kartinka.gif " width="300"> <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Увеличилась высота и ширина. Но не пытайтесь растянуть её до фонового рисунка. Чтоб картинку сделать фоном пишем в открывающем <body>: <body bgcolor="#ccffcc" text="#330099" background=" Первая страничка\kartina.gif "> Если фоновый рисунок грузится долго, можно изменить у него формат и уменьшить цветà. Это можно сделать в Adobe Photoshop (Файл → Сохранить для WEB), в открывшемся окне выбрать формат и уменьшить цветà. В нижнем левом углу будет показан вес фонового рисунка. У меня на примере это будет так: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099" background="stroisait/kartinka.gif"> <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <img src=" http://astchen2006.narod.ru/stroisait/kartinka.gif " width="300"> <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Теперь вставим ссылку на страничку. Пишем: <a href="http://astchen2006.narod.ru/stroisait/risunki.html">Рисунки</a>(пример1). Если вам надо, чтобы ссылка на ваши рисунки открывалась в отдельном окне пишем: target="_blank" (пример 2) Пример 1: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099" > <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <a href="http://astchen2006.narod.ru/stroisait/risunki.html">Рисунки</a> <br> <img src=" http://astchen2006.narod.ru/stroisait/kartinka.gif " width="300"> <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Пример 2: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099" > <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <a href=http://astchen2006.narod.ru/stroisait/risunki.html target="_blank">Рисунки </a> <br> <img src=" http://astchen2006.narod.ru/stroisait/kartinka.gif " width="300"> <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Фон я убрала, чтоб не отвлекал. Сделаем теперь так, чтобы ссылка была картинкой. Пишем: <a href="prf.html"><img src="primtocodephoto.gif"></a> Пример: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099"> <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> <a href=" http://astchen2006.narod.ru/stroisait/risunki.html"><img src="stroisait/kartinka.gif "></a> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? А теперь сделаем ссылку на вашу почту. Пишем между <body></body>: <a href="mailto:здесь адрес "> здесь название </a> Вот, что получилось у меня: <a href="mailto:Nasta13-93@mail.ru"> почтовый ящик </a> Пример можете посмотреть у меня в разделе ссылки. Бегущая строка: <marquee height="10" width="270" bgcolor="#ff6666" scrollamount="8" loop="3">Бегущая строка</marquee> Разберём – height, width вам уже знакомы (высота, ширина); bgcolor – цвет; Loop – сколько кругов пробежит ваша строчка, у нас три, так что пробежит 3 круга и остановится; scrollamount – скорость, задаём значения от 1 до 10. Пример: <html> <head> <title>Народ.Ру: Новая страница</title> </head> <body> <marquee height="30" width="400" bgcolor="#ff6666" scrollamount="8" loop="3">Бегущая строка</marquee> </body> </html> Посмотрим? Посмотрите в тэгах, что можно ещё изменить в бегущей строке, с помощью других атрибутов для тега marquee. Чтоб выровнять объект, текст воспользуйтесь тегом <dif></dif>, посмотрите в тэгах, какие атрибуты применимы для него. Пример: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099"> <center> <h2> Всем привет!!!</h2> </center> <br> <pre> Хорошая погода. Пойду я погуляю. Вернусь не поздно и досмотрю любимое кино. </pre> <br> <div align="center"> <a href="http://astchen2006.narod.ru/stroisait/risunki.html"><img src="http://astchen2006.narod.ru/stroisait/kartinka.gif"></a> </dif> <br> Здесь будет находится вся красота вашей странички (тэги), текст, фон, картинки… <br> <font color="#ff3333"><i>тут текст у которого меняем цвет</i></font> </body> </html> Посмотрим? Ещё для выравнивания текста можно воспользоваться тегом параграф <p></p>. Текст заключённый в него можно выровнять, как вам надо с помощью атрибута align, на следующей странице, я буду об этом обязательно говорить. И ещё этот тег имеет свойство блока, т.е, с верху и с низу добавляется пустая строка. Пример: <html> <head> <title>Первая страничка</title> </head> <body bgcolor="#ccffcc" text="#330099"> <center> <h2> Всем привет!!!</h2> </center> Здесь будет находиться вся красота вашей странички (тэги), текст, фон, картинки… <p> Учимся работать с параграфами, с помощью них можно выровнять текст. Текст заключённый в данный тег становится блоком. </p> До и после блока всегда будет добавляться пустая строка. Чтоб вы не запутались, я всё лишнее убрала. </body> </html> Посмотрим?

Продолжение следует... Смотрите в "Обновлениях" на Главной.
1 2 3

Copyright © 2006-2007 Astchen2006_ http://astchen2006.narod.ru All rights reserved. Все права защищены. Всё, материалы этой статьи запрещенно копировать и распространять (без разрешения администратора) они предназначены для ознакомительных целей.



Hosted by uCoz