 |
Апельсин
Дата добавления: 2014-11-24 | Просмотров: 1520
|
|
2) Нәтижені браузерден қараңыз.
3) Алма сөзінің үстіне <ul>тегін және Апельсинсөзінен кейін </ul> тегін енгізіңіз.
4) <li>тегінің көмегімен меркерленген тізім элементін анықтаңыз
5) Нәтижені браузерден қараңыз
6) Алма сөзінен кейін <ol>жаңа нөмірленген тізім тегін енгізіңіз
7) Тізім элементтерін енгізіңіз (тег <li>):
Алматылық
Ақтөбелік
Атыраулық
8) Тізімде </ol>тегімен жабыңыз
9) Нәтижені браузерден қараңыз.
10) Алматылықсозінен кейін жаңа маркерленген тізім енгізіңіз (тег <ul type=circle>).
11) Бұл тізімнің элементтерін жазыңыз (тег <li>):
Қысқы
Күзгі
Көктемгі
Жазғы
12) Тізімді жабыңыз.
13) Браузерден қараңыз және сараптаңыз.
14) Өздеріңіз үшдеңгейлі, әртүрлі тізім түрлерін қолданып, тізім құрыңыздар.
3) Анықтамалыр тізімі.
<DL> - анықтамалар тізімінің басы
<DT>, <DD> - мәтіннің басы және оны түсіндіретін мақала.
3 тапсырма:
1) Бетше денесінің соңына түпкі кодты кошіріп жаз (</body> тегінің алдына):
2) Сақтаңыз және нәтижені браузерден қараңыз.
3) Өздігіңізбен екі анықтамаық тізім құрыңыз.
Бақылау сұрақтары:
1. Тізімді нөмірлеу үшін қандай тегтер қолданылады?
2. Маркерленген тізім жасау үшін қандай тегтер қолданылады?
3. Қандай тегтер анықтамалық тізім үшін қолданылады?
Зертханалық жұмыс №4.
Жұмыстың мақсаты:графикалық суреттермен жұмыс жасау
1. графикалық суретті салу
Тег <IMG SRC=”?”> - ? белгісінің орнына графикалық файлдың жолан және атын енгізіңіз (тырнақша салмай-ақ қоюға болады)
Ескерту:
өзіңізге ыңғайлы болу үшін суреттерді HTML-құжат тұрған деректорияға салыңыз, сонда шатастырулар болмайды.
Каталогтар(папка) атында бос орын болмау керек!
Мысалы:
1) <img src=my.jpg> - суреттер HTML-құжат тұрған каталогта (директория, папка) орналасқан. my.jpg орнына біз .gif, .jpeg және .png кеңейтілуі бар кез келген суреттің атын қоя аламыз.
3) <img src=my/my.jpg> - MY поддиректориында орналасқан
4) <img src=../my.jpg> - сурет бір деңгейге жоғары орналасқан,ал HTML-құжат поддиректорида орналасқан
5) <img src=http://www.homepage.ru/my/my.jpg> - сурет басқа сайтта орналасқан
2) <p><br><center><img src=my.jpg></center> -жаңа жолда, көлденең бойынша ортамен тураланған
Alt атрибуты суретті қарау мүмкін болмағанда орнына мәтін енгізуге мүмкіндік береді.
Мысалы:
<img src =images/ежик.jpgAlt =бұл жерде қарапайым кірпінің суреті бар>
1 ТАПСЫРМА:
1. өз дискіңізде S:\Html\Images құжатын жасақтаңыз
2. IMAGES құжатына кез келген ұнаған суретіңізді енгізіңіз
3. Төмендегі мәтінді Блокнотқа көшіріп алып оны lab4.html етіп Html құжатында сақтаңыз
<html>
<head>
<title> Менің бетшем </title>
</head>
<body text=green bgcolor=#aaaaaa>
<center>
<H3>Сәлеметсіздер ма, бұл менің екінші бетшем.</H3>
<br>
<font color=#CC0000> Қош келдіңіздер!</font></center>
<p align=justify>
<img src =? Alt =?>мен виртуалды өмірмен жағадан тынсып жүрмін, бірақ бұрынғы әдет бойынша вертуалды достарыма, фотомды қарап, мен туралы оқу үшін өз бетшемді жасағым келді. <br><br> мүмкін жай қолданушы менімен достасқысы келіп, және менде <b> жаңа виртуалды дос пайда болатын шығар </b>
<br><br> Фотода мен суреттелгем. Суреттің сапасы окінішке орай жақсы емес, сондықтан ол анық емесжәне менің бетімді анық көру қыйынға соғады. Бірақ жалпы мен жаман емес екендігім көрініп тұр. <br><br>Егер сен де солай ойласан, кездесейк, кафеде бір-екі шыны шәй ішіп әңгімелесерміз? Кім білген, екеуміз шын өмірде де дос боп кетерміз.
</p>
</body>
</html>
4. ? белгісінің орнына суреттің жолын және оның атын енгізіңіз (жоғарыдағы мысалды қараңыз)
5. Егер сурет оқылмай қалатын жағдайға арнап, оны түсіндірмелік мәтінмен жасақтаңыз.
6. Нәтижесін қараңыз.
2. Графикалық суретті әспеттеу.
<img>тегінің бойындағы BORDER =?абреватурасысуреттің айналасына пиксельмен өлшенген жақтау салады. Сұрақ белгісінің орнына қалыңдықтың мәні енгізіледі. Жақтауды кетіру үшін қалыңдықтың мәнін 0 етіп белгілеу керек.
2 ТАПСЫРМА:
Суретіңіздің жанына жақтау салыңыз.
3. Графикаалық суретке қатысты мәтінді енгізу
3.1 бір жол ғана емес, мәтін толықтай суреттің қасында орналасу үшін, қажетті параметрлер енгізу керек. Мысалы:
<img> тегінің ішіндегі ALIGN=? атрибуты –суреттің мәтінге қатысты орналасуын көрсетеді, сұрақ белгісі келесі мәндердің бірімен алмасады:left(мәтіннің сол жағынжа), right(оң жағында), bottom(суреттен төмен), top(жоғары), middle(ортасында)
мысал:
<img src="pr1.png" align=bottom>
3 ТАПСЫРМА:
Беттің мәтінін суреттің оң жағына орналастырыңыз.
3.2. Сурет және мәтін орналастырудың қосымша атрибуттары.
1) Суреттің өлшемі:
<img>дескрипторының ішіндегі Width =? Және Height =? атрибуттары -суреттің ені мен бйіктігін береді (пиксель және браузердің терезесіне қатысты - %).
2) Суреттен мәтінге дейінгі қашықтық:
<img>дескрипторыныңішіндегі Vspace=? және Hspace=?атребуттары – сурет пен мәтін арасындағы қашықтықты (тігінен және көлденеңінен) пиксельмен береді.
ЗАДАНИЕ 4:
1. Измените размеры вашей картинки в сторону уменьшения.
2. Измените расстояние от текста до изображения, задав значения атрибутов HSPACE=30 и VSPACE=5
3. Добавьте вторую картинку или фотограцию в ваш документ с шириной, равной 130 пикселам, размещенной справа от текста странички.