Sveučilište u Zagrebu Fakultet strojarstva i brodogradnje. WEB programiranje HTML & CSS
|
|
- Alexina Bryant
- 5 years ago
- Views:
Transcription
1 Sveučilište u Zagrebu Fakultet strojarstva i brodogradnje WEB programiranje HTML & CSS Autor/i: Juraj Benić 2018
2 1. Zadatak Kreirati stranicu kojoj će naslov biti Zadatak 1. i veličina teksta 20px te staviti jedan komentar, a stranica će biti ista kao i Slika 1. Slika 1 2. Zadatak Kreirati stranicu koja će imati tri linka, jedan na stranicu FSB-a koja se otvara u novom tabu, drugi za slanje mail-a i zadnji link na teks koji se nalazi na kraju dokumenta. Na stranici će se nalaziti numerirana lista s opisom svakog linka. Na kraju dokumenta se mora nalaziti link Kraj dokumenta odmaknut 1000px od početka stranice. Slika 2 1
3 3. Zadatak Potrebno je napraviti tablicu 2x3 prema slici 3 koja se nalazi na div elementu rotiranom za 45 i centriranom na stranici. Prvi red tablice je tekstualni, a tekst je poravnat s desne strane. U drugom redu su brojke u plavoj boji, a druga ćelija ima brojke u crvenoj boji. CSS treba definirati pomoć style taga unutar head taga. Raditi s klasama i id-evima. Tablica imam obrub crne boje debljine 1px, a svaka ćelija ima širinu od 140px. Slika 3 4. Zadatak Potrebno je napraviti stranicu prema slici 4. Lijevi div element zauzima 50% širine ekrana, a desni div element 40%. Na desnom divu nalazi se forma sa sedma input polja koji su redom tipa text, text, password, button, checkbox, radio i submit. Gumb klikni ima atribut onclick= alert( U ovoj formi probajte staviti i checkbox i radiobutton ) koji generira obavijest prilikom klika na gumb. Forma ne poziva niti jednu akciju. Tekst Moj tag je nevidljiv! generiran je pomoću vlastitog html taga <mojtag>. Zadatak riješiti pomoću vanjskog css koji se poziva na slijedeći način: 1 <li nk href= "{{ =URL (' static ', 'css / ime_css_datoteke.css ')}}" rel= " stylesheet " type= " text / css "> Slika 4 2
4 HTML & CSS 5. Zadatak Potrebno je postaviti z utu podlogu pozadine, sliku pozadine (slika Galaxy.jpg) koja se ponavlja po y osi i pozicionirana je u centru ekrana. U lijevom gornjem kutu potrebno je uc itati sliku w3schools.png, a u centru ekrana potrebno je uc itati animirani gif pod nazivom Loptice.gif. Slike je potrebno kopirati u mapu static/images. Za kreiranje putanje do slike koristi se python naredba: 1 {{ =URL ( ' static ', ' images / i m e _ s l i k e. e k s t e n z i j a ' ) }} Slika 5 3
5 6. Rješenja Kod 1: Zadatak 1 HTML 4 <title > Zadatak 1 </title > 5 <meta charset= " utf8 "> <!-- podaci o dokumentu --> 6 </head > 7 <body style= " font-size:20px; "> 8 9 <h1 > Naslov 1 </h1 > 10 <p> 11 prvi paragraf <span style= " color: red; " > ja sam span </ span > 12 </p > <hr > 15 <h3 > Naslov 3 </h3 > 16 <hr > 17 <h6 > Naslov 6 </h6 > <p style= " text-align:right; "> 20 random tekst s <b> blod< /b>, <i> italic< /i> i <u> podcrtanom< /u> rijeci 21 </p > <!-- komentar --> 25 </body > 26 </html > Kod 2: Zadatak 2 HTML 4 <title > Linkovi i liste </ title > 5 <meta charset= " utf8 "> <!-- podaci o dokumentu --> 6 </head > 7 <body style= " font-size:20px; "> 8 9 <a href= "# kraj " > Link unutar dokumenta - kraj dokumenta </a > </ br > 10 <a href= " http: // /" target= " _blank "> Link na web stranicu FSB- a u novom tabu </a > <br > 11 <a href= " mailto:ime.prezime@ .com "> Slanje poruke </a > <hr > 14 Linkovi: 15 <ol > 16 <li > unutar istog dokumenta - href= "# kraj " </li > 17 <li >na udaljene dokumente - href= " http: // " </li > 18 <li > ostalo - href= " mailto:ime.prezime@ .com " </li > 19 </ol > 20 4
6 21 <a id= " kraj " style= " position: absolute; top: 1000 px; " > Kraj dokumenta </a > <br > </body > 24 </html > Kod 3: Zadatak 3 HTML i CSS 4 <title >id i klase </title > 5 <meta charset= " utf8 "> <!-- podaci o dokumentu --> 6 7 <style > 8 table, th, td { border: 1 px solid black; } 9 td { width: 140 px; } 10. tekst { text- align: right; } 11. broj { color: blue; } # celija-2-2 { color:red; } # priv { 16 margin: auto; 17 width: 320px; 18 background- color: # fff; 19 -webkit-transform: rotate ( -45deg ); 20 -moz-transform: rotate ( -45deg ); 21 position: relative; 22 top: 140 px; 23 } 24 </style > </head > 27 <body style= " font- size: 20px; " > <div id= " priv "> <table > 32 <tbody > 33 <tr > 34 <td class= " tekst "> daispf </td > 35 <td class= " tekst "> daispf </td > 36 <td class= " tekst "> daispf </td > 37 </tr > 38 <tr > 39 <td class= " broj "> 1233 </td > 40 <td class= " broj " id= " celija-2-2 "> </td > 41 <td class= " broj "> 324 </td > 42 </tr > 43 </tbody > 44 </table > </div >
7 49 </body > 50 </html > Kod 4: Zadatak 4 HTML 4 <title > Zadatak 4. </ title > 5 <meta charset= " utf8 " > 6 <li nk href= "{{ =URL (' static ', 'css / zadatak_4.css ')}}" rel= " stylesheet " type= " text / css "> 7 </head > 8 9 <body > <div id= " Lijevispremnik " > 12 Ovo je tablica: 13 <table > 14 <tr > <td > ć elija 1,1 </td > <td > ć elija 1,2 </td > <td > ć elija 1,3 </td > </tr > 15 <tr > <td > ć elija 2,1 </td > <td > ć elija 2,2 </td > <td > ć elija 2,3 </td > </tr > 16 </table > <br > <p class= " zaparagraf " > Ovaj paragraf je u stilu klase </p > 21 <p class= " zaparagraf " > Ovaj paragraf je u stilu klase </p > 22 <p > Ovaj paragraf je u stilu klase </p > 23 <p class= " zaparagraf " > Ovaj paragraf je u stilu klase </p > </div > <div id= " Desnispremnik " > Ovo ispod je forma: <br > <hr > <br > <br > 30 <form target= " _blank " method= " post "> <input type= " text " name= " Ime " value= " Unesi ime "></ input > <br > 33 <input type= " text " name= " Prezime " value= " Unesi prezime "></ input > <br > 34 <input type= " password " name= " psw " value= " 125 "></ input > <br > 35 <input type= " button " onclick= " alert (' U ovoj formi probajte staviti i checkbox i radiobutton ')" value= " Klikni!" > </ input > <br > 36 <input type= " checkbox " name= " chbox "> Ozna či ako misli š da si sve razumio!</ input > <br > 37 <input type= " radio " name= " rdbutton "> Slu šaš li radio ;-)?</ input > <br > <input type= " submit " name= " Submit " value= "Poš alji "></ input > </ form > 42 6
8 43 <mojtag onclick= " alert (' Vidljiv si! ')"> Moj tag je nevidljiv!</ mojtag > </div > </body > 48 </html > 1 table { 2 background- color: # E00000; 3 color: white; 4 border: 2px solid black; 5 width: 70%; 6 margin- left: auto; 7 margin- right: auto; 8 } 9 10 td { 11 border: 1px dashed white; 12 } div { 15 border: 4px dotted black; 16 } div # Lijevispremnik { 19 width: 50 %; 20 float: left; 21 background-color:yellow; 22 } div # Desnispremnik { 25 width: 40 %; 26 float: right; 27 border: 3px green solid; 28 } mojtag { 31 color: green; 32 font- size: 22px; 33 } p. zaparagraf { 36 background-color:black; 37 color: white; 38 } Kod 5: Zadatak 4 CSS Kod 6: Zadatak 5 HTML 4 <title > Slike i gifovi </ title > 5 <meta charset= " utf8 "> <!-- podaci o dokumentu --> 7
9 6 7 <style > 8 body { 9 background-image: url ("{{ =URL (' static ', ' images / Galaxy.jpg ') }}"); 10 background- color: yellow; 11 background- position: center; 12 background- repeat: repeat- y; 13 } img { 16 width: 200px; 17 height: 100px; 18 } 19 </style > </head > <body > <!-- slika --> 26 PNG slika<img src= "{{ =URL (' static ', ' images / w3schools.png ')}}" alt= " Ako nema slike tu je tekst " > <br / > <p style= " text-align:center;color: # ffffff "> Animirani GIF <img src= "{{ =URL (' static ', ' images / Loptice.gif ')}}" alt= " Nema </body > 31 </html > loptica "> </p > 8
recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML)
HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML specifies formatting within a page using tags in its
More informationCSC 121 Computers and Scientific Thinking
CSC 121 Computers and Scientific Thinking Fall 2005 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language
More informationHTML Summary. All of the following are containers. Structure. Italics Bold. Line Break. Horizontal Rule. Non-break (hard) space.
HTML Summary Structure All of the following are containers. Structure Contains the entire web page. Contains information
More informationA Balanced Introduction to Computer Science, 3/E
A Balanced Introduction to Computer Science, 3/E David Reed, Creighton University 2011 Pearson Prentice Hall ISBN 978-0-13-216675-1 Chapter 2 HTML and Web Pages 1 HTML & Web Pages recall: a Web page is
More informationRačunarske osnove Interneta (SI3ROI, IR4ROI)
Računarske osnove terneta (SI3ROI, IR4ROI) Vežbe MPLS Predavač: 08.11.2011. Dražen Drašković, drazen.draskovic@etf.rs Autori: Dražen Drašković Naučili ste na predavanjima MPLS (Multi-Protocol Label Switching)
More informationCSS Box Model. Cascading Style Sheets
CSS Box Model Cascading Style Sheets CSS box model Background Width & height Margins & padding Borders Centering content Changing display type (block vs. inline) The Box Model Background Properties Property
More informationCIS 228 (Fall, 2012) Exam 2, 11/20/12
CIS 228 (Fall, 2012) Exam 2, 11/20/12 Name (sign) Name (print) email Question 1 2 3 4 5 6 7 8 9 10 TOTAL Score CIS 228, exam 2 1 11/20/12 True or false: Question 1 Unordered lists can contain ordered sub-lists.
More informationLING 408/508: Computational Techniques for Linguists. Lecture 14
LING 408/508: Computational Techniques for Linguists Lecture 14 Administrivia Homework 5 has been graded Last Time: Browsers are powerful Who that John knows does he not like? html + javascript + SVG Client-side
More informationDeccansoft Software Services
Deccansoft Software Services (A Microsoft Learning Partner) HTML and CSS COURSE SYLLABUS Module 1: Web Programming Introduction In this module you will learn basic introduction to web development. Module
More informationUnit 20 - Client Side Customisation of Web Pages. Week 2 Lesson 4 The Box Model
Unit 20 - Client Side Customisation of Web Pages Week 2 Lesson 4 The Box Model So far Looked at what CSS is Looked at why we will use it Used CSS In-line Embedded (internal style-sheet) External
More informationIzrada VI laboratorijske vježbe
Izrada VI laboratorijske vježbe 1. Programirati proceduru koja se aktivira sa Standard palete alatki klikom na button Fajlovi. Prilikom startovanja procedure prikazuje se forma koja sadrži jedan list box
More informationUnit 20 - Client Side Customisation of Web Pages. Week 2 Lesson 4 The Box Model
Unit 20 - Client Side Customisation of Web Pages Week 2 Lesson 4 The Box Model Last Time Looked at what CSS is Looked at why we will use it Used CSS In-line Embedded (internal style-sheet) External
More informationWeb Engineering CSS. By Assistant Prof Malik M Ali
Web Engineering CSS By Assistant Prof Malik M Ali Overview of CSS CSS : Cascading Style Sheet a style is a formatting rule. That rule can be applied to an individual tag element, to all instances of a
More informationHTTP and HTML. We will use HTML as a frontend to our webapplications, therefore a basic knowledge of HTML is required, especially in forms.
HTTP and HTML We will use HTML as a frontend to our webapplications, therefore a basic knowledge of HTML is required, especially in forms. HTTP and HTML 28 January 2008 1 When the browser and the server
More informationHTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS
MOST TAGS CLASS Divides tags into groups for applying styles 202 ID Identifies a specific tag 201 STYLE Applies a style locally 200 TITLE Adds tool tips to elements 181 Identifies the HTML version
More informationBuilding Page Layouts
Building Page Layouts HTML & CSS From Scratch Slides 3.1 Topics Display Box Model Box Aesthetics Float Positioning Element Display working example at: h9ps://;nker.io/3a2bf Source: unknown. Please contact
More informationVRIJEDNOSTI ATRIBUTA
VRIJEDNOSTI ATRIBUTA Svaki atribut (bilo da je primarni ključ, vanjski ključ ili običan atribut) može i ne mora imati ograničenja na svojim vrijednostima. Neka od ograničenja nad atributima: Null / Not
More informationHTML and CSS: An Introduction
JMC 305 Roschke spring14 1. 2. 3. 4. 5. The Walter Cronkite School... HTML and CSS: An Introduction
More informationWeb Design and Development ACS Chapter 12. Using Tables 11/23/2017 1
Web Design and Development ACS-1809 Chapter 12 Using Tables 11/23/2017 1 Using Tables Understand the concept and uses of tables in web pages Create a basic table structure Format tables within web pages
More informationIntroduction to using HTML to design webpages
Introduction to using HTML to design webpages #HTML is the script that web pages are written in. It describes the content and structure of a web page so that a browser is able to interpret and render the
More informationProgrammazione Web a.a. 2017/2018 HTML5
Programmazione Web a.a. 2017/2018 HTML5 PhD Ing.Antonino Raucea antonino.raucea@dieei.unict.it 1 Introduzione HTML HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text
More informationWanted! Introduction. Step 1: Styling your poster. Activity Checklist. In this project, you ll learn how to make your own poster.
Wanted! Introduction In this project, you ll learn how to make your own poster. Step 1: Styling your poster Let s start by editing the CSS code for the poster. Activity Checklist Open this trinket: jumpto.cc/web-wanted.
More informationCSC Web Technologies, Spring HTML Review
CSC 342 - Web Technologies, Spring 2017 HTML Review HTML elements content : is an opening tag : is a closing tag element: is the name of the element attribute:
More informationHtml basics Course Outline
Html basics Course Outline Description Learn the essential skills you will need to create your web pages with HTML. Topics include: adding text any hyperlinks, images and backgrounds, lists, tables, and
More informationThe default style for an unordered (bulleted) list is the bullet, or dot. You can change the style to either a square or a circle as follows:
CSS Tutorial Part 2: Lists: The default style for an unordered (bulleted) list is the bullet, or dot. You can change the style to either a square or a circle as follows: ul { list-style-type: circle; or
More informationCSS CSS. selector { property: value; } 3/20/2018. CSS: Cascading Style Sheets
CSS CSS CSS: Cascading Style Sheets - Opisuje izgled (appearance) i raspored (layout) stranice - Sastoji se od CSS pravila, koji defini[u skup stilova selector { property: value; 1 Font face: font-family
More informationWelcome Please sit on alternating rows. powered by lucid & no.dots.nl/student
Welcome Please sit on alternating rows powered by lucid & no.dots.nl/student HTML && CSS Workshop Day Day two, November January 276 powered by lucid & no.dots.nl/student About the Workshop Day two: CSS
More informationCSS. https://developer.mozilla.org/en-us/docs/web/css
CSS https://developer.mozilla.org/en-us/docs/web/css http://www.w3schools.com/css/default.asp Cascading Style Sheets Specifying visual style and layout for an HTML document HTML elements inherit CSS properties
More informationHTML. LBSC 690: Jordan Boyd-Graber. October 1, LBSC 690: Jordan Boyd-Graber () HTML October 1, / 29
HTML LBSC 690: Jordan Boyd-Graber October 1, 2012 LBSC 690: Jordan Boyd-Graber () HTML October 1, 2012 1 / 29 Goals Review Assignment 1 Assignment 2 and Midterm Hands on HTML LBSC 690: Jordan Boyd-Graber
More information2005 WebGUI Users Conference
Cascading Style Sheets 2005 WebGUI Users Conference Style Sheet Types 3 Options Inline Embedded Linked Inline Use an inline style sheet to modify a single element one time in a page.
More informationCIS 228 (Spring, 2012) Final, 5/17/12
CIS 228 (Spring, 2012) Final, 5/17/12 Name (sign) Name (print) email I would prefer to fail than to receive a grade of or lower for this class. Question 1 2 3 4 5 6 7 8 9 A B C D E TOTAL Score CIS 228,
More informationNAVIGATION INSTRUCTIONS
CLASS :: 13 12.01 2014 NAVIGATION INSTRUCTIONS SIMPLE CSS MENU W/ HOVER EFFECTS :: The Nav Element :: Styling the Nav :: UL, LI, and Anchor Elements :: Styling the UL and LI Elements CSS DROP-DOWN MENU
More informationICT IGCSE Practical Revision Presentation Web Authoring
21.1 Web Development Layers 21.2 Create a Web Page Chapter 21: 21.3 Use Stylesheets 21.4 Test and Publish a Website Web Development Layers Presentation Layer Content layer: Behaviour layer Chapter 21:
More informationDownloads: Google Chrome Browser (Free) - Adobe Brackets (Free) -
Week One Tools The Basics: Windows - Notepad Mac - Text Edit Downloads: Google Chrome Browser (Free) - www.google.com/chrome/ Adobe Brackets (Free) - www.brackets.io Our work over the next 6 weeks will
More informationAs we design and build out our HTML pages, there are some basics that we may follow for each page, site, and application.
Extra notes - Client-side Design and Development Dr Nick Hayward HTML - Basics A brief introduction to some of the basics of HTML. Contents Intro element add some metadata define a base address
More informationSberbank Business Online na Mozilla FireFox
Sberbank Business Online na Mozilla FireFox Verzija 1.6 Srpanj 2016. Sberbank d.d. Stranica 1 SADRŽAJ 1 INSTALACIJA... 2 2 POKRETANJE MOZILLE FIREFOX... 3 2.1 IMPORT SECURITY MODULA... 4 2.2 AUTOMATSKI
More information1/6/ :28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014
1/6/2019 12:28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014 CATALOG INFORMATION Dept and Nbr: CS 50A Title: WEB DEVELOPMENT 1 Full Title: Web Development 1 Last Reviewed:
More information3.1 Introduction. 3.2 Levels of Style Sheets. - HTML is primarily concerned with content, rather than style. - There are three levels of style sheets
3.1 Introduction - HTML is primarily concerned with content, rather than style - However, tags have presentation properties, for which browsers have default values - The CSS1 cascading style sheet specification
More informationGIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar with Dynamic Background Image
GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar with Dynamic Background Image WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR DYNAMIC BACKGROUND IMAGE Before you begin this tutorial, you will need
More informationCSC Web Programming. Introduction to HTML
CSC 242 - Web Programming Introduction to HTML Semantic Markup The purpose of HTML is to add meaning and structure to the content HTML is not intended for presentation, that is the job of CSS When marking
More informationHTML and CSS COURSE SYLLABUS
HTML and CSS COURSE SYLLABUS Overview: HTML and CSS go hand in hand for developing flexible, attractively and user friendly websites. HTML (Hyper Text Markup Language) is used to show content on the page
More informationNetworks and Web for Health Informatics (HINF 6220) Tutorial 8 : CSS. 8 Oct 2015
Networks and Web for Health Informatics (HINF 6220) Tutorial 8 : CSS 8 Oct 2015 What is CSS? o CSS (Style Sheet) defines how HTML elements are formatted and displayed. o It helps you easily change an HTML
More informationICT IGCSE Practical Revision Presentation Web Authoring
21.1 Web Development Layers 21.2 Create a Web Page Chapter 21: 21.3 Use Stylesheets 21.4 Test and Publish a Website Web Development Layers Presentation Layer Content layer: Behaviour layer Chapter 21:
More information- The CSS1 specification was developed in CSSs provide the means to control and change presentation of HTML documents
3.1 Introduction - The CSS1 specification was developed in 1996 - CSS2 was released in 1998 - CSS3 is on its way - CSSs provide the means to control and change presentation of HTML documents - CSS is not
More informationepromo Guidelines DUE DATES NOT ALLOWED PLAIN TEXT VERSION
epromo Guidelines HTML Maximum width 700px (length = N/A) Image resolution should be 72dpi Maximum total file size, including all images = 200KB Only use inline CSS, no stylesheets Use tables, rather than
More informationMake a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1
Make a Website A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Overview Course outcome: You'll build four simple websites using web
More information- HTML is primarily concerned with content, rather than style. - However, tags have presentation properties, for which browsers have default values
3.1 Introduction - HTML is primarily concerned with content, rather than style - However, tags have presentation properties, for which browsers have default values - The CSS1 cascading style sheet specification
More informationGIMP WEB 2.0 MENUS. Web 2.0 Menus: Horizontal Navigation Bar
GIMP WEB 2.0 MENUS Web 2.0 Menus: Horizontal Navigation Bar WEB 2.0 MENUS: HORIZONTAL NAVIGATION BAR Hover effect: You may create your button in GIMP. Mine is 122 pixels by 48 pixels. You can use whatever
More informationWireframe :: tistory wireframe tistory.
Page 1 of 45 Wireframe :: tistory wireframe tistory Daum Tistory GO Home Location Tags Media Guestbook Admin 'XHTML+CSS' 7 1 2009/09/20 [ ] XHTML CSS - 6 (2) 2 2009/07/23 [ ] XHTML CSS - 5 (6) 3 2009/07/17
More informationIndex. alt, 38, 57 class, 86, 88, 101, 107 href, 24, 51, 57 id, 86 88, 98 overview, 37. src, 37, 57. backend, WordPress, 146, 148
Index Numbers & Symbols (angle brackets), in HTML, 47 : (colon), in CSS, 96 {} (curly brackets), in CSS, 75, 96. (dot), in CSS, 89, 102 # (hash mark), in CSS, 87 88, 99 % (percent) font size, in CSS,
More informationChapter 3 Style Sheets: CSS
WEB TECHNOLOGIES A COMPUTER SCIENCE PERSPECTIVE JEFFREY C. JACKSON Chapter 3 Style Sheets: CSS 1 Motivation HTML markup can be used to represent Semantics: h1 means that an element is a top-level heading
More informationc122sep2214.notebook September 22, 2014
This is using the border attribute next we will look at doing the same thing with CSS. 1 Validating the page we just saw. 2 This is a warning that recommends I use CSS. 3 This caused a warning. 4 Now I
More informationHTML What is HTML Hyper Text Markup Language is a computer based language used to create WebPages.
vinsri76@yahoo.com +965-69300304 HTML What is HTML Hyper Text Markup Language is a computer based language used to create WebPages. Name Two text Editor which are used to create HTML page. They are: Notepad
More informationGoSquared Equally Rounded Corners Equally Rounded Corners -webkit-border-radius -moz-border-radius border-radius Box Shadow Box Shadow -webkit-box-shadow x-offset, y-offset, blur, color Webkit Firefox
More informationMultimedia Systems and Technologies Lab class 6 HTML 5 + CSS 3
Multimedia Systems and Technologies Lab class 6 HTML 5 + CSS 3 Instructions to use the laboratory computers (room B2): 1. If the computer is off, start it with Windows (all computers have a Linux-Windows
More informationOsnove programskog jezika C# Čas 5. Delegati, događaji i interfejsi
Osnove programskog jezika C# Čas 5. Delegati, događaji i interfejsi DELEGATI Bezbedni pokazivači na funkcije Jer garantuju vrednost deklarisanog tipa. Prevodilac prijavljuje grešku ako pokušate da povežete
More informationHyper Text Markup Language HTML: A Tutorial
Hyper Text Markup Language HTML: A Tutorial Ahmed Othman Eltahawey December 21, 2016 The World Wide Web (WWW) is an information space where documents and other web resources are located. Web is identified
More informationWEBSITE PROJECT 2 PURPOSE: INSTRUCTIONS: REQUIREMENTS:
WEBSITE PROJECT 2 PURPOSE: The purpose of this project is to begin incorporating color, graphics, and other visual elements in your webpages by implementing the HTML5 and CSS3 code discussed in chapters
More information3.1 Introduction. 3.2 Levels of Style Sheets. - The CSS1 specification was developed in There are three levels of style sheets
3.1 Introduction - The CSS1 specification was developed in 1996 - CSS2 was released in 1998 - CSS2.1 reflects browser implementations - CSS3 is partially finished and parts are implemented in current browsers
More information- The CSS1 specification was developed in CSS2 was released in CSS2.1 reflects browser implementations
3.1 Introduction - The CSS1 specification was developed in 1996 - CSS2 was released in 1998 - CSS2.1 reflects browser implementations - CSS3 is partially finished and parts are implemented in current browsers
More informationPart 1: HTML Language HyperText Make-up Language
Part 1: HTML Language HyperText Make-up Language 09/08/2010 1 CHAPTER I Introduction about Web Design 2 Internet and World Wide Web The Internet is the world s largest computer network The Internet is
More informationUPUTSTVO ZA KORIŠĆENJE NOVOG SPINTER WEBMAIL-a
UPUTSTVO ZA KORIŠĆENJE NOVOG SPINTER WEBMAIL-a Webmail sistem ima podršku za SSL (HTTPS). Korištenjem ovog protokola sva komunikacija između Webmail sistema i vašeg Web čitača je kriptovana. Prilikom pristupa
More informationUNIVERSITI TEKNOLOGI MALAYSIA TEST 1 SEMESTER II 2012/2013
UNIVERSITI TEKNOLOGI MALAYSIA TEST 1 SEMESTER II 2012/2013 SUBJECT CODE : SCSV1223 (Section 05) SUBJECT NAME : WEB PROGRAMMING YEAR/COURSE : 1SCSV TIME : 2.00 4.00 PM DATE : 18 APRIL 2013 VENUE : KPU 10
More informationHTML HTML5. DOM(Document Object Model) CSS CSS
HTML HTML5 DOM(Document Object Model) CSS CSS HTML html img jpg png gif jpg png gif
More informationBlock & Inline Elements
Block & Inline Elements Every tag in HTML can classified as a block or inline element. > Block elements always start on a new line (Paragraph, List items, Blockquotes, Tables) > Inline elements do not
More informationNews System - Level 1 Internship
In this project we are developing a site having simple rss news sliders. There are in all 8 of which 1 is div having static text of about us and the rest of the have news updates about different
More informationIntroduction to WEB PROGRAMMING
Introduction to WEB PROGRAMMING Web Languages: Overview HTML CSS JavaScript content structure look & feel transitions/animation s (CSS3) interaction animation server communication Full-Stack Web Frameworks
More informationCSS Cascading Style Sheets
CSS Cascading Style Sheets site root index.html about.html services.html stylesheet.css images boris.jpg Types of CSS External Internal Inline External CSS An external style sheet is a text document with
More informationAssignments (4) Assessment as per Schedule (2)
Specification (6) Readability (4) Assignments (4) Assessment as per Schedule (2) Oral (4) Total (20) Sign of Faculty Assignment No. 02 Date of Performance:. Title: To apply various CSS properties like
More informationCSS3 Basics. From & CSS Visual Dictionary Learning Curve Books, LLC
CSS3 Basics From www.w3schools.com & CSS Visual Dictionary Learning Curve Books, LLC CSS Box Model Margin (top, right, bottom, left) Shorthand property, equivalent to Border-width border-style border-color
More informationITL Public School Mid Term examination ( )
ITL Public School Mid Term examination (017-18) Date:15.09.17 Multimedia and Web Technology (Answer Key )- (067) Class: XI 1 Answer the following questions based on HTML: i. Identify any four formatting
More informationCreating Web Pages. Getting Started
Creating Web Pages Getting Started Overview What Web Pages Are How Web Pages are Formatted Putting Graphics on Web Pages How Web Pages are Linked Linking to other Files What Web Pages Are Web Pages combine
More informationWebsite Development with HTML5, CSS and Bootstrap
Contact Us 978.250.4983 Website Development with HTML5, CSS and Bootstrap Duration: 28 hours Prerequisites: Basic personal computer skills and basic Internet knowledge. Course Description: This hands on
More informationLab 4 CSS CISC1600, Spring 2012
Lab 4 CSS CISC1600, Spring 2012 Part 1 Introduction 1.1 Cascading Style Sheets or CSS files provide a way to control the look and feel of your web page that is more convenient, more flexible and more comprehensive
More informationCreating Web Pages Using HTML
Creating Web Pages Using HTML HTML Commands Commands are called tags Each tag is surrounded by Some tags need ending tags containing / Tags are not case sensitive, but for future compatibility, use
More informationName Related Elements Type Default Depr. DTD Comment
Legend: Deprecated, Loose DTD, Frameset DTD Name Related Elements Type Default Depr. DTD Comment abbr TD, TH %Text; accept-charset FORM %Charsets; accept FORM, INPUT %ContentTypes; abbreviation for header
More informationThe Importance of the CSS Box Model
The Importance of the CSS Box Model Block Element, Border, Padding and Margin Margin is on the outside of block elements and padding is on the inside. Use margin to separate the block from things outside
More informationPart 3: Images & form styling NOMZAMO S WEBSITE
Part 3: Images & form styling NOMZAMO S WEBSITE 1 OUR MISSION: In this lesson, we ll learn 3 new things 1. How to include the logo image 2.How to add background image 3.How to style the email input form
More informationITNP43: HTML Lecture 5
ITNP43: HTML Lecture 5 1 The Box Model Every HTML element (e.g. h2, p etc) lies within a virtual box: Margin area LEFT TOP This is just some text that flows onto two lines. Border RIGHT Padding area BOTTOM
More informationCOPYRIGHTED MATERIAL. Contents. Introduction. Chapter 1: Structuring Documents for the Web 1
Introduction Chapter 1: Structuring Documents for the Web 1 A Web of Structured Documents 1 Introducing HTML and XHTML 2 Tags and Elements 4 Separating Heads from Bodies 5 Attributes Tell Us About Elements
More informationProgramiranje za internet HTML, CSS, Adobe Dreamweaver zimski semestar 2013/2014
Programiranje za internet HTML, CSS, Adobe Dreamweaver zimski semestar 2013/2014 Zadatak broj 1 (Struktura HTML stranice) U ovoj vježbi treba napraviti web stranicu kao na slici.
More informationCOPYRIGHTED MATERIAL. Contents. Chapter 1: Creating Structured Documents 1
59313ftoc.qxd:WroxPro 3/22/08 2:31 PM Page xi Introduction xxiii Chapter 1: Creating Structured Documents 1 A Web of Structured Documents 1 Introducing XHTML 2 Core Elements and Attributes 9 The
More informationCSS Tutorial Part 1: Introduction: A. Adding Style to a Web Page (3 options):
CSS Tutorial Part 1: Introduction: CSS adds style to tags in your html page. With HTML you told the browser what things were (e.g., this is a paragraph). Now you are telling the browser how things look
More informationNASLOV SEMINARSKOG RADA (16 pt, Bold) Seminarski rad. (16 pt, Bold)
Sveučilište u Zagrebu (12 pt, Bold) Ekonomski fakultet (12 pt, Bold) Naziv diplomskog studija (12 pt, Bold) NASLOV SEMINARSKOG RADA (16 pt, Bold) Seminarski rad (16 pt, Bold) Ime i prezime studenta/studentice,
More information3. Each of these mark examples contains an error. a. <input name= country value= Your country here. /> b. <checkbox name= color value= teal />
1. Decide whether each of these forms should be sent via the GET or POST method: A form for accessing your bank account online A form for sending t-shirt artwork to the printer A form for searching archived
More informationHTML WORKSHEET Explain HTML HEAD Tag Title Tag BASEFONT Tag
vinsri76@yahoo.com HTML WORKSHEET Explain HTML HEAD Tag Title Tag BASEFONT Tag 1. 2. Text Editor 1. 2. Graphic Editor Name & Explain Attribute of Body Tags 1. 2. 1. 2. 3. 4. Name & Explain Attribute of
More informationCSS CSS how to display to solve a problem External Style Sheets CSS files CSS Syntax
CSS CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem External Style Sheets can save a lot of work External Style Sheets
More information1. The basic building block of an HTML document is called a(n) a. tag. b. element. c. attribute. d. container. Answer: b Page 5
Name Date Final Exam Prep Questions Worksheet #1 1. The basic building block of an HTML document is called a(n) a. tag. b. element. c. attribute. d. container. Answer: b Page 5 2. Which of the following
More informationWhat is the Box Model?
CSS Box Model What is the Box Model? The box model is a tool we use to understand how our content will be displayed on a web page. Each HTML element appearing on our page takes up a "box" or "container"
More informationCSS Selectors. element selectors. .class selectors. #id selectors
CSS Selectors Patterns used to select elements to style. CSS selectors refer either to a class, an id, an HTML element, or some combination thereof, followed by a list of styling declarations. Selectors
More informationParashar Technologies HTML Lecture Notes-4
CSS Links Links can be styled in different ways. HTML Lecture Notes-4 Styling Links Links can be styled with any CSS property (e.g. color, font-family, background, etc.). a { color: #FF0000; In addition,
More informationCOMP519 Web Programming Lecture 6: Cascading Style Sheets: Part 2 Handouts
COMP519 Web Programming Lecture 6: Cascading Style Sheets: Part 2 Handouts Ullrich Hustadt Department of Computer Science School of Electrical Engineering, Electronics, and Computer Science University
More informationStudy Guide 2 - HTML and CSS - Chap. 6,8,10,11,12 Name - Alexia Bernardo
Study Guide 2 - HTML and CSS - Chap. 6,8,10,11,12 Name - Alexia Bernardo Note: We skipped Study Guide 1. If you d like to review it, I place a copy here: https:// people.rit.edu/~nbbigm/studyguides/sg-1.docx
More informationCOMP519 Web Programming Lecture 8: Cascading Style Sheets: Part 4 Handouts
COMP519 Web Programming Lecture 8: Cascading Style Sheets: Part 4 Handouts Ullrich Hustadt Department of Computer Science School of Electrical Engineering, Electronics, and Computer Science University
More informationThe internet is a worldwide collection of networks that link millions of computers. These links allow the computers to share and send data.
Review The internet is a worldwide collection of networks that link millions of computers. These links allow the computers to share and send data. It is not the internet! It is a service of the internet.
More informationPerfect Student Midterm Exam March 20, 2007 Student ID: 9999 Exam: 7434 CS-081/Vickery Page 1 of 5
Perfect Student Midterm Exam March 20, 2007 Student ID: 9999 Exam: 7434 CS-081/Vickery Page 1 of 5 NOTE: It is my policy to give a failing grade in the course to any student who either gives or receives
More informationSummary 4/5. (contains info about the html)
Summary Tag Info Version Attributes Comment 4/5
More informationHow to use the Dealer Car Search ebay posting tool. Overview. Creating your settings
How to use the Dealer Car Search ebay posting tool Overview The Dealer Car Search ebay posting tool is designed to allow you to easily create an auction for a vehicle that has been loaded into Dealer Car
More informationHTML + CSS. ScottyLabs WDW. Overview HTML Tags CSS Properties Resources
HTML + CSS ScottyLabs WDW OVERVIEW What are HTML and CSS? How can I use them? WHAT ARE HTML AND CSS? HTML - HyperText Markup Language Specifies webpage content hierarchy Describes rough layout of content
More information