Проект

 Изтегли файла

 

ПОДГОТВИ СВОЕТО CV (АВТОБИОГРАФИЯ)

Автобиография

Добавяне на изображения и линкове в Гугъл сайтове - 07.05.20г.

8. Добавяне на изображения и линкове в Гугъл сайтове

Видео

Добавяне на елементи и текст в Гугъл Сайтове - 30.04.20г.

Видео урок

Избор и управление на основно меню в Гугъл Сайтове - 29.04.2020г.

6. Избор и управление на основно меню в Гугъл Сайтове

Видео към урока

Създаване на страници в Гугъл Сайтове - 23.04.20г

5. Как да създаваме страници в Гугъл Сайтове

Видео урок

Изгледайте и този видео урок. Другата седмица ще ви дам проект за създаване сайт чрез гугъл.

Тема, лого и управление на Гугъл Сайтове 22.04.20г

3. Как да зададем Тема и Лого на Гугъл Уебсайт

Видео урок

4. Управление на Гугъл Сайтове

Управление на Гугъл Сайтове - видео

Изгледайте видео уроците. 

Въведение и как да създадем Гугъл сайтове. 15.04.2020г.

1. Въведение в Гугъл Сайтове и Как да Създадем Уебсайт за Училищен Проект

Видео урок

2. Как да създадем Гугъл Уебсайт

Видео урок

Изгледайте уроците

Проект: 01.04 - 03.04.20г.

Създайте презентация на тема „Континенти“. 

Изисквания към презентацията:

1. На втория слайд да има съдържание;

2. За всеки континент основните данни да се представят в таблица;

3. Презентацията да съдържа 12 – 15 слайда;

4. Анимации на отделните обекти;

5. Преходи на слайдовете.

Проект - 25 - 27.03

Тема 1: АПАРАТНА ЧАСТ НА КОМПЮТЪРА

1.Дънна платка( Motherboard).

o   Основни компоненти на дънната платка;

o   Портове на дънната платка;

o   Слотове;

o   Шини.

2.Централен процесор.

o   Характеристики;

o   Основни дейности;

o   Основни компоненти на централния процесор.

3.Вътрешна памет.

o   Оперативна памет (Random Acces Memory - RAM);

o   Постоянна вътрешна памет (Read Only Memory - ROM).

4.Външна памет.

o   Твърд диск;

o   Оптични устройства (устройствата за работа със CD и DVD дискове – CD/DVD Drive );

o   Флаш-памет (USB Flash).

5. Видеокарта (Video card).
6.Mрежова карта (Lan card).

7.Входни устройства.

o   Мишка;

o   Клавиатура.

8. Изходни устройства.

o   Монитори;

o   Принтери.

9.Захранващ блок.

Изисквания към презентацията:

1. Първият слайд да съдържа информация за вас – вашите имена, клас, номер, училище, логото на училището и темата.
2. Следващият слайд да представя подробен план на темата. Да се създаде връзка на всяка тема от съдържанието със съответния слайд.
3. От всеки слайд да има връзка чрез бутон към втория слайд на съдържанието.

Изпратете я на имейл: 

distance_it@abv.bg

На тема си запишете името, номера, клас.

Задача 18 - 20.03.2020г.

Проект : Венеция
Изтеглете следния файл:

Изтегли файла

Разархивирайте го. 

Това са файловете в тази папка.
След това:

Изпратете решението на задачата до петък вечерта (20.03.2020г.) на имейл:

distance_it@abv.bg    

Не забравяйте: на Тема да напишете име, клас и номер.

Форматиране на текст в HTML

Тук ще разгледаме как се форматира текст в HTML: изменяне дебелината на шрифта, посоката, наклона и големината на текста, отделяне на текст като вмъкнат, изтрит или като цитат и др. За нагледен пример служат самите заглавия на отделните видове формат.

1.   Получер текст

Задава се с двойката тагове <b> и </b> . Същият ефект има и използването на <strong> и </strong>:

<b>Получер</b> текст 

2.   Курсивен текст

Огражда се с таговете <i> и </i>. Алтернативно може да се използват и таговете <em> и </em>:

<i>Курсивен</i> текст

3.   Подчертан текст.

Mоже да се зададе с таговете <u> и </u>:

<u>Подчертан</u> текст.

4.   Уголемен текст

Можете да откроите даден текст като по-голям с таговете <big> и </big>:

<big>Уголемен</big> текст

5.   Умален текст

Ако оградите дадена фраза с таговете <small>и </small>, тази фраза ще бъде показана с по-малък размер от останалия текст:

<small>Умален</small> текст

6.   ^Горен индекс

Указва се с таговете ^и:

^{Горен индекс}.

7.   _Долен индекс

От своя страна долен индекс се задава с _и:

_Долениндекс

8.   Вмъкнат текст

За да откроите даден текст като вмъкнат, оградете го с таговете <ins> и </ins>:

<ins>Вмъкнат</ins> текст

Обърнете внимание, че браузърът ще представи подобен текст като подчертан.

9.   Изтрит текст

Ако искате да подчертаете, че даден текст е изтрит (много чест похват при промоции с наблягане на факта колко висока е старата цена), използвайте <del> и</del>:

<del>Изтрит</del> текст

10.<abbr> ...</abbr> - Използва се за абревиатури. Маркерът има и атрибут "title" , на който се задава като стойност пълното название на съкращението. Стойността на "tittle" се изписва, когато се задържи стрелката на мишката върху абревиатурата.

 Например : 

·                     <abbr title="БЪЛГАРСКИ ДЪРЖАВНИ ЖЕЛЕЗНИЦИ">БДЖ</abbr>

Ще изглежда така :

ЗАГЛАВИЯ В HTML

В HTML  заглавията се задават с маркера <h*>...</h*>. По този начин заглавието автоматично става удебелено и се добавя по един ред над и под текста. Другото предимство на маркера е, че може да се окаже размерът на заглавието - просто до  hзаписваме цифра от 1 - 6. С най-голям размер е h1 , а с най-малък - h6. Например :

<h1>Заглавие 1</h1>
<h2 align="center">Заглавие 2</h2>
<h3 align="center">Заглавие 3</h3>
<h4 align="center">Заглавие 4</h4>
<h5 align="center">Заглавие 5</h5>
<h6>Заглавие 6</h6>

Ще изглежда така : 

Заглавие 1

Заглавие 2

Заглавие 3

Заглавие 4

Заглавие 5

Заглавие 6

Ако искаме на заглавието да се укаже подравняване , тогава включваме и атрибутаalign, чийто стойности са left (вляво), right (вдясно), center (центрирано).

Таблица с цветовете

1. ЗАДАЧА:  Създайте следната таблица в Excel:

a) изчислете баланса (печалба/загуба) за всеки месец на годината;

б) изразете графично баланса с линейна диаграма;

в) изразете графично месечните приходи и разходи с колонна диаграма;

г) вмъкнете подходящи заглавия и на двете диаграми;

д) да се покажат етикетите с данните (за двете диаграми).

2. ЗАДАЧА: 
1. Създайте таблица, описваща броя на оценките по математика в края на учебната година. Имайте предвид, че са получени следния брой оценки:
Слаб  - 3 бр;
Среден - 5 бр;
Добър - 10 бр;
Много добър - 8 бр;
Отличен - 4 бр.
2. Сортирайте таблицата по брой оценки в низходящ ред.
3. Създайте диаграма, която пропорционално да показва съотношението на броя оценки, задайте заглавие "Оценки по математика" и покажете процентния дял на всяка оценка.

Упражнение

https://itmateriali.weebly.com/uploads/1/8/9/3/18930151/upr3_firma_yavor.pdf

Задачата да се изработи с програмата Word и да се изпрати до 14 януари 2019 година. Посочете името и  класа си на мястото на името на автора в самия документ.

1задача: Фoрматирайте документа по следния начин:

а/размер А4 и отстъпи от всички страни 2,5см;

б/шрифт - Calibri (Body),заглавие 16pt,основен текст -  размер 14pt;

в/разстояние между редовете - 1,5 lines;

г/отстъп на първи ред - 1,5см.

 2 задача:Създайте следната таблица в Word:

Създайте следната форма чрез HTML:

Формуляри

Освен за показване на информация WEB страниците могат да служат и за събиране на информация от потребителя. Това става с така наречените формуляри. За съжаление езика HTML не ви позволява да управлявате информацията във формулярите, а само да ги разполагате на страницата си. Двойката елементи за разполагане на формуляри е <FORM></FORM>. Между тази двойка елементи могат да се разполагат неограничен брой формуляри. Всеки един формуляр се разполага с единичния елемент <INPUT>. Този елемент трябва задължително да съдържа двата атрибута NAME и TYPE. Атрибута NAME задава името на формуляра а TYPE видът му. Нека разгледаме различните стойности на TYPE.

<HTML><BODY>
<FORM>
<INPUT NAME="form1" TYPE="text">
</FORM>
</BODY>
</HTML>

Този HTML документ ще покаже на екрана следното текстово поле: 

Такъв тип едноредово текстово поле се задава със стойността на атрибута TYPE="text". Вие можете да променяте дължината на полето с атрибута SIZE. Ако пропуснете SIZE се показва поле с дължина 20 символа. По подразбиране полето се показва празно, но вие можете да  зададете някаква начална стойност на полето. Това става с атрибута VALUE. Нека направим едно текстово поле с дължина 50 символа и надпис в него "това поле съдържа текст и има дължина от 50 символа".

<FORM>
<INPUT NAME="form2" TYPE="text" SIZE="40" VALUE="това поле съдържа текст и има дължина от 40 символа">
</FORM>

Понеже текста който се показва е по-дълъг от 40 символа, последните няколко символа се скриват. Ако кликнете върху полето можете да местите видимата част на текста наляво и надясно с помощта на стрелките за движение от клавиатурата. Също така можете да напишете свой текст в полето. Ако текста който пишете е по дълъг от дължината на полето, той автоматично започва да се скролира наляво и разкрива новонаписаните символи. Опитайте! Можете да ограничите дължината на изписвания текст с атрибута MAXLENGHT. Например с MAXLENGHT="40" ограничавате надписа до 40 символа.

Друг параметър на атрибута TYPE е password. Той действа по същия начин като text, с изключение на това, че в полето не се показва самия текст, който въвеждате, а звездички.

<FORM>
<INPUT NAME="form3" TYPE="password">
</FORM>

checkbox

Напишете нещо в това поле и ще видите как всеки символ се заменя със звездичка. Това е особено полезно, когато текста е някаква парола и не трябва да се вижда от хората около вас.

Друг тип формуляри са кутиите с отметки. Те се задават със стойността checkbox на атрибута TYPE.

<FORM>
<INPUT NAME="form4" TYPE="checkbox" ><BR>
<INPUT NAME="form5" TYPE="checkbox"><BR>
<INPUT NAME="form6" TYPE="checkbox" CHECKED>
</FORM>

Кутиите с отметки служат за избор на една или няколко възможности едновременно. Ако кликнете в кутията, отметката се появява. Ако кликнете повторно отметката изчезва. Можете да правите отметки в повече от една кутия. По пдразбиране кутиите с отметки се показват празни. Ако искате да се показва отметка в дадена кутия, използвайте атрибута checked.

  
радиобутоните
  Подобни на кутиите с отметки са радиобутоните. Разликата е, че при радиобутоните може да бъде отметнат само един бутон. Когато изберете друг бутон, отметката в предишния изчезва. Особеното при радиобутоните е, че всички трябва да носят едно и също име, в случая NAME="R1". Радиобутон се създава с атрибута TYPE="radio".

<FORM>
<INPUT TYPE="radio" VALUE="V1" checked  NAME="R1"><BR>
<INPUT TYPE="radio" NAME="R1" VALUE="V2"><BR>
<INPUT TYPE="radio" NAME="R1" VALUE="V3">
</FORM>

бутоните SUBMIT и RESET

 Друг тип формуляри са бутоните SUBMIT и RESET. Когато се използват в комбинация с друг формуляр, тези два бутона съответно потвърждават или изчистват въведената информация. Вижте :

     Бутона RESET  изчиства полето, в случай че сте въвели нещо в него, а бутона SUBMIT потвърждава въведената информация. В случая при натискане на бутона SUBMIT няма да има ефект. Опитайте! Въведете нещо в полето и натиснете бутоните! Ето как изглежда HTML кода на горния пример :

<FORM >
<INPUT TYPE="text" NAME="T1" SIZE="20">
<INPUT TYPE="submit" VALUE="Submit" NAME="B1">
<INPUT TYPE="reset" VALUE="Reset" NAME="B2">
</FORM>

   SUBMIT бутон се създава с атрибута TYPE="submit". Атрибута VALUE="Submit" задава какъв да бъде надписа на бутона. Можете да го промените по свое желание. За бутона RESET се ползва атрибута TYPE="reset". Останалите атрибути на RESET действат  аналогично с тези на SUBMIT.

формуляр във вид на многоредово поле

   Можете да създадете формуляр във вид на многоредово поле с елемента <TEXTAREA>. Размера на полето се задава с атрибутите COLS и ROWS. COLS показва колко символа да е широко полето, в случая 30, а ROWS от колко реда да се състои, в случая 3. 

<FORM >
<TEXTAREA ROWS="3" NAME="S1" COLS="30">textarea</TEXTAREA>
</FORM>

    Когато използвате елемента <TEXTAREA>, не се използва елемент <INPUT>. Текста, който се намира между  <TEXTAREA> и </TEXTAREA>,  се показва по подразбиране в полето. Ако пропуснете текста полето ще се покаже празно.

падащите менюта

    Последния тип формуляри, който ще ви покажа са падащите менюта. Такъв вид формуляри се създават с елемента <SELECT>. Вижте : 

  избор 1 избор 2 избор 3 

    Кликнете с мишката върху стрелката надолу и ще се покаже меню с 3 избора, избор 1, избор 2 и избор 3. Стойностите, които да се показват в менюто се задават с елемента <OPTION>. Вижте HTML кода на горния пример :

<FORM >
<SELECT SIZE="1"NAME="D1">
    <OPTION>избор 1</OPTION>
    < OPTION>избор 2</OPTION>
    < OPTION>избор 3</OPTION>
</SELECT>
</FORM>

   Атрибута SIZE на елемента <SELECT> задава броя на редовете, които да се показват в менюто. Когато SIZE="1", тогава се наблюдава т.нар. падащо меню. Ако зададете стойност по-голяма от 1, тогава вече ще се показва вертикална превъртаща лента. Вижте горното меню, само че със стойност SIZE="5" :

 Избор 1 Избор 2 Избор 3 Избор 4 Избор 5 Избор 6 Избор 7 Избор 8 

Таблици в HTML

1.Основни тагове

Таблиците в HTML-документа са разположени между двата основни тага <table> и </table>.

Между тези два тага се изписват:- таговете за табличен ред - <tr> и </tr> 
- таговете за таблична клетка, чрез които се оформят редовете и колоните - <td> и </td>

За да има таблицата видими очертания трябва в тага table да се добави атрибута border и да му се зададе някаква стойност, например 1.

ПРИМЕР за таблица с 1 колона и 3 реда:

< table border="1">
     <tr>
           <td>1-ви ред, 1-ва колона</td>
     </tr>
     <tr>
           <td>2-ри ред, 1-ва колона</td>
     </tr>
     <tr>
           <td>3-ти ред, 1-ва колона</td>
     </tr>
< /table>
-таг за заглавие на таблицата - <th> и </th> . Всеки текст разположен между таговете <th> и </th> се показва в центъра на клетката и удебелен.

ПРИМЕР:

< table border="1">
     <tr>
          <th>Заглавие 1</th>
          <th>Заглавие 2</th>
     </tr>
     <tr>
          <td>1-ви ред, 1-ва колона</td>
          <td>1-ви ред, 2-ра колона</td>
     </tr>
     <tr>
          <td>2-ри ред, 1-ва колона</td>
          <td>2-ри ред, 2-ра колона</td>
     </tr>
< /table>

- таговете <thead> </thead>, <tfoot> </tfoot> и 
<tbody> </tbody> позволяват групиране на редовете на таблицата.
Една таблица може да съдържа горна част (head), долна част (foot) и средна част или тяло (body). Ако в тялото (средната част) на таблицата е поместена много информация, уеб-дизайнера ще "загуби от поглед" горната и долната част на таблицата. За удобство и прегледност в текстовия редактор, където се пише HTML-кода, чрез таговете <thead>, <tfoot> и <tbody> горната и долната част на таблицата могат да се групират непосредствено една под друга, а "тялото", т.е. средната част на таблицата да се изпише най-отдолу. В браузъра горната част на таблицата ще се показва най-горе, средната част - по средата и долната част - най-долу.

ПРИМЕР:

< table border="1">
  <thead>
      <tr>
         <td>Горна част на таблицата, която се изписва горе</td>
      </tr>
  </thead>
  <tfoot>
      <tr>
         <td>Долна част на таблицата, която се изписва по средата</td>
      </tr>
  </tfoot>
  <tbody>
      <tr>
         <td>Средна част на таблицата, която се изписва долу</td>
      </tr>
  </tbody>
< /table>2.Атрибути на тага <table>
border="цифрова стойност" задава рамка на таблицата в пиксели

bordercolor="цвят" задава цвят на рамката

bgcolor="цвят" задава цвят на фона на таблицата

background="изображение" задава изображение като фон

align="left, center или right" задава позициониране на таблицата вляво, в центъра или вдясно

width="цифрова стойност или процент" задава дължина на таблицата в пиксели или в процент от свободното пространство

cellpadding="цифрова стойност или процент" задава разстоянито между съдържанието на клетката и стените и в пиксели или процент

cellspacing="цифрова стойност или процент" задава разстоянито в пиксели или процент между отделните клетки

frame="една от стойностите: lhs, rhs, vsides, above, below, hsides, void, box, border", където

lhs премахва горната, долната и дясната рамка на таблицата
rhs премахва горната, долната и лявата рамка на таблицата
vsides премахва горната и долната рамка на таблицата
above премахва страничните и долната рамка на таблицата
below премахва страничните и горната рамка на таблицата
hsides премахва страничните рамки на таблицата
void премахва външните рамки на таблицата
box и border показват всички рамки (същия ефект е по подразбиране)!!! За да се ползва трибута frame трябва на атрибута border  да е зададена стойност различна от 0.

ПРИМЕР:

<table width="300" border="1" frame="void" cellspacing="0" cellpadding="3">
    <tr align="center">
        <td><a href="">Линк 1</a></td>
        <td><a href="">Линк 2</a></td>
        <td><a href="">Линк 3</a></td>
    </tr>
    <tr align="center">
        <td><a href="">Линк 4</a></td>
        <td><a href="">Линк 5</a></td>
        <td><a href="">Линк 6</a></td>
    </tr>
< /table>

В горния пример е създадена таблица без външни рамки чрез използване на стойността void в атрибута frame.

Забележка: атрибутите "align" и "bgcolor" на тага <table> са извадени от стандартите на езика и не се поддържа от XHTML, макар че браузърите ще продължат да ги поддържат.

3.Атрибути на тага <tr>
align="left, center или right" позиционира съдържанието на реда вляво, в центъра или вдясно

valign="top, middle или bottom" позиционира съдържанието на реда горе, в средата или долу

bgcolor="цвят" задава цвят на фона на реда

bordercolor="цвят" задава цвят на рамката (задължително е в такъв случай стойността border на таблицата да бъде различна от 0)
Забележка: атрибута "bgcolor" на тага <tr> е изваден от стандартите на езика и не се поддържа от XHTML, макар че браузърите ще продължат да го поддържат.

4.Атрибути на тага <td>
align="left, center или right" позиционира съдържанието на колона вляво, в центъра или вдясно

valign="top, middle или bottom" позиционира съдържанието на колона горе, в средата или долу

bgcolor="цвят" задава цвят на фона на колоната

background="изображение" задава изображение като фон на клетката

colspan="цифрова стойност" определя колко колони обхваща една клетка

rowspan="цифрова стойност" определя колко реда обхваща една клетка

width="цифрова стойност или процент" задава ширина на клетката в пиксели или процент от възможното пространство

height="цифрова стойност" задава височина на клетката в пиксели

Забележка: атрибутите "bgcolor", "height" и "width на тага <td> са извадени от стандартите на езика и не се поддържа от XHTML, макар че браузърите ще продължат да ги поддържат.

Горния пример е за таблица центрирана в браузера, с ширина 80%, височина 300 пиксела, с рамка 1 пиксел, жълт фон, разстояние от съдържанието до рамката 2 пиксела, разстояние между клетките 2 пиксела, с 2 странични колони, обхващащи по 3 реда и по един горен и долен ред, обхващащи по 3 колони.