History. HTML (HyperText Markup Language) The tags. HTML documents. The browsers. The attributes. A.Lioy - Politecnico di Torino ( ) E-1
|
|
- Thomas Garrison
- 6 years ago
- Views:
Transcription
1 HTML (HyperText Markup Language) Antonio Lioy < it > english version created by Marco D. Aime < > Politecnico di Torino Dip. Automatica e Informatica History HTML 2.0 (nov 95 = RFC-1886) specifies the de-facto standard of 1994 HTML 3.2 (1996) compatible with 2.0 adds tables, applets, superscripts, subscripts, text surrounding images, HTML 4.01 (dec 97 apr 98 dec 99) last (?) version of HTML XHMTL 1.0 (jan 00 aug 02) rewriting of HTML 4.01 with XML strict / transitional / frameset HTML documents are normal US-ASCII texts therefore, letters with accents or other extended characters are not allowed... enriched with hypertext and hypermedia links... and with limited text formatting capabilities all these additional capabilities are achieved through annotations expressed with tags The tags enclosed between the symbols less than" and greater than" usually they are paired (start tag end tag) <h1>... </h1> but can also be standalone <br> ( <br /> in XHTML) general rule: the final tag is the same of the initial one, preceded by the symbol / they are case insensitive in HTML and lowercase in XHTML therefore it is better to write them always lowercase The attributes you can better characterise a tag by using a set of attributes every attribute consists in a variable with an assigned value, placed inside the opening tag (e.g. <hr width="90%">) The browsers visualising HTML documents (and navigate them) requires an appropriate program: an HTML browser a browser is an interpreter: reads the source code (HTML + extensions) tries to understand it (hoping there are no errors ) does its best to visualise what is described by the source code attention! not every browser visualises a given document in the same way textual browser: Lynx graphical browsers: Firefox, SeaMonkey, Netscape, Opera, Internet Explorer,... A.Lioy - Politecnico di Torino ( ) E-1
2 The war of the browsers there is not a single browser much more diffused than the others (personal preferences, platform, ) you must try to write HTML pages that fit every browser some statistics: (jan-10) IE8=14%, IE7=12%, IE6=10%, FX=46%, Chrome=11%, Safari=4%, Opera=2% high variability difficult to identify various browsers with certainty General structure of HTML documents <!DOCTYPE HTML PUBLIC...> <head> <title> title </title>... other headers... </head> <body> text of the document </body> Document type declaration (DTD) required to identify the type of HTML (from 4.01): strict.dtd = all non-deprecated elements loose.dtd = includes deprecated elements frameset.dtd = loose + use of frames <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN " <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" " Example <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <head> <title>example of HTML page</title> </head> <body> Here I can insert my document s text, which will be visualised as simple text if I don t use any formatting tag. </body> Notes browsers do not signal errors: they ignore them! white spaces and end of lines: multiple spaces are treated as a single space end-of-lines has no effect on the formatting the title (and in general the data inside the head) is very important since it is the element most used by automatic indexing services HTML is an extensible language often new tags are added browsers ignore unrecognised tags (or attributes) but visualise the text enclosed inside the tag Meta-data inside the HEAD part data useful for: indexing the HTML page providing information to the web server and / or to the browser syntax: <meta name="author" content="antonio Lioy"> <meta name="keywords" content="html"> <meta http-equiv="content-type" content="text/html; charset=iso "> <meta http-equiv="expires" content="sun, 28 Feb :59:00 GMT"> A.Lioy - Politecnico di Torino ( ) E-2
3 HTML internationalization HTML < 4 written with the ISO encoding HTML-4 incorporates RFC-2070 that deals with internationalization (i18n in brief) of HTML adoption of the ISO/IEC:10646 standard as the document character set user agebts determine the character encoding according to (from highest to lowest priority): HTTP response header "Content-Type: charset=xxx" proper META tag in the HTML header <meta http-equiv="content-type" charset=xxx" > charset attribute of an element that designates an external resource The link tag inside the HEAD part logical connection to documents somehow related to the current one multiple LINK tags are possible attributes: href=url rel=alternate lang= rel=alternate media= rel=stylesheet rel=start / contents / prev / next / type=mime-type Example of LINK <head> <title>chapter 2</title> <link rel="contents" href="../toc.html"> <link rel="next" href="chapter3.html"> <link rel="prev" href="chapter1.html"> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> Tools for checking HTML allows verifying if a page fully satisfies the official syntax can provide detailed explanations on the errors and on how to correct them cleans the HTML code and transforms it to more recent versions can be installed locally or used through the network problems with dynamically generated HTML (cannot validate an ASP or PHP source page) Tools for checking HTML validation of dynamic pages must be performed on the client rather than on the server therefore, you need: a special plugin for the browser manually visit all the pages to be validated an excellent plugin for FireFox: configured in "SGML parser" mode to have the same results of validator.w3.org Comments can be inserted at every point in the text can span multiple lines enclosed inside <!-- and --> examples: <! - this is a comment --> <!-- this comment spans four lines --> A.Lioy - Politecnico di Torino ( ) E-3
4 Headings there are six levels of headings or titles: <h1>... </h1> <h2>... </h2> <h3>... </h3> <h4>...</h4>.. <h5>... </h5> <h6>... </h6> should be used according to the logical meaning (semantics), not to achieve a specific formatting in particular, it is not correct to use <hn> if not preceded by <hn-1> Text blocks <p>... </p> starts and terminates a paragraph after terminating a paragraph, browsers break the current line (and may also insert a small vertical space) <br> (HTML) <br/> (XHTML) inserts a line break <hr> (HTML) <hr/> (XHTML) inserts an horizontal rule (line) Horizontal rules (tag <HR>) (*) can specify the following attributes: size= n_pixel (height) width= n_pixel (absolute width) width= percentuale (width as % of the container) align=left left / right / center by default the line is centered and has a width of 100% attention!: HTML presentational attributes have been deprecated since style sheets exist (e.g. CSS) unordered list: <ul>... </ul> ordered list: <ol>... </ol> directory (deprecated): <dir>... </dir> Lists menu (deprecated): <menu>... </menu> an element of (any) list: <li>... </li> Options for lists symbol preceding the items in unordered lists: type=disc / circle / square numbering style in ordered lists: start= index_of_the_first_item type=a / a / I / i / 1 that is: alphabetic list (uppercase or lowercase) roman numbers (uppercase or lowercase) decimal numbers can be specified for the whole list (ol) and for the single element (li) List example To pass the exam: <ol type="i"> <li>attend the lessons</li> <li>perform the lab exercises</li> </ol> browser (note the indentation) To pass the exam: I. attend the lessons II. perform the lab exercises A.Lioy - Politecnico di Torino ( ) E-4
5 definition lists: Definitions <dl> <dt> term 1 </dt> <dd> definition 1... </dd> <dt> term 2 </dt> <dd> definition 2... </dd>..... </dl> Text formatting a text block can be characterised based on the role it plays in the document (logical style) or based on the way we want to visualise it physically (physical style) best to prefer logical styles and to leave greater freedom to the final user in defining how the text should appear on the screen with XHTML (strict), the formatting tags have finally disappeared (you need to use CSS) Formatting: physical styles <b>... </b> bold text <i>... </i> italic text <u>... </u> underlined text <tt>... </tt> monospace text (like typewriter) <blink>... </blink> blinking text Formatting: physical styles <sup>... </sup> superscript text <sub>... </sub> subscript text <s>... </s> <strike>... </strike> strikethrough text Formatting: logical styles <cite> citation </cite > <code> code (program) </code> <em> emphasis </em> <kbd> keyboard </kbd> <samp> example </samp> <strong> reinforcement </strong> <var> variable </var> <dfn> definition </dfn> Other logical styles <big> big text </big> <small> small text </small> can be nested to achieve an increased effect: <big> <big> very big text </big> </big> A.Lioy - Politecnico di Torino ( ) E-5
6 Formatting: text blocks <address>... </address> address (typically ) <blockquote>... </blockquote> long citations <center>... </center> centered text <pre>... </pre> preformatted text (spacing is preserved) Reference to non US-ASCII characters HTML normally written in US-ASCII with MSB=0 ASCII characters > 127 must be encoded, as also characters with special meaning pay attention to the final ";" to have... write... < < > > & & " " È È é é important since these are HTML reserved characters Reference to non US-ASCII characters section 24 (pg. 299) in the HTML 4.01 standard includes: ISO extended characters e.g.» =» mathematical symbols e.g. = Greek letters e.g. α = α international symbols e.g. = Links ( hyperlinks ) by using hyperlinks you can move automatically from a resource to another the HTML tag identifying the presence of a link is named anchor, and is identified with <a> Hot to insert an hyperlink open the anchor opening tag: <a insert a space insert the URL of the resource, preceded by href= and enclosed by apices close the opening tag with > insert the text to highlight (the one associated with the anchor, called "hot word") close the anchor: </a> <a href=" Absolute and relative links it is possible to omit parts of the URL in this case, it is called a relative link the missing parts assume the same value of the current page examples of relative links (supposed to be placed inside the page relative link biblio.html../cv.html res/a1.html absolute link A.Lioy - Politecnico di Torino ( ) E-6
7 Document access points Link without specification of an access point Title doc01 Address Title Address Title doc02 Address Document access points in the target document, define the access point through an anchor with the attribute NAME <a name="cuc_ita"> La cucina italiana </a> in the origin document, include the name of the access point in the URL <a href="doc2.html#cuc_ita"> the access point can also be any element identified through its "id" <h1 id="cuc_ita"> La cucina italiana </h1> Images <img src="polito.gif"> inserts the image contained in the file polito.gif <img src="polito.gif" alt= Picture of Politecnico"> inserts the image polito.gif, but, if the browser does not support graphics, it visualises the text Picture of Politecnico difference between linking and inserting an image: <img src="polito.gif"> (inserts the image inside the page) <a href="polito.gif"> (by following the link, you visit a page containing only the image) Reciprocal positioning of text and images <img align=left...> <img align=right...> <img align=top...> <img align=center...> <img align=texttop...> <img align=middle...> <img align=absmiddle...> <img align=baseline...> <img align=bottom...> <img align=absbottom...> Image formatting <img width=w height=h... > image size allows rapid visualisation of the page (the browser does not need to download the image before knowing how much space should be reserved to it) <img vspace=v hspace=h... > minimum distance between text and the image <img border=b... > size of the border Font <font... >... </font> font for the text block included within the tags deprecated (use CSS) attributes: size= size color= color face= font-family the size can be specified in various units: N (=1 7, default=3), +N, N suggested +N N A.Lioy - Politecnico di Torino ( ) E-7
8 Colors some predefined colors are accessible by name: Black, White, Gray, Silver, Yellow, Red, Purple, Fuchsia, Maroon, Green, Lime, Olive, Aqua, Teal, Blue, Navy other colors can be specified through their RGB hexadecimal code ( # rr gg bb ) example: <font color="#ffffff">white!</font> Standard colors black = # green = # silver = #C0C0C0 lime = #00FF00 gray = # olive = # white = #FFFFFF yellow = #FFFF00 maroon = # navy = # red = #FF0000 blue = #0000FF purple = # fuchsia = #FF00FF teal = # aqua = #00FFFF <table... >... </table> attributes: Tables align= left / center / right border= size width= size (n_pixel or %) cellspacing= size cellpadding= size summary= text frame= void / above / below / hsides / lhs / rhs / vsides / box / border rules = none / groups / rows / cols / all <tr... >... </tr> a row of the table Table data contains normal (<td>) or heading (<th>) cells <th... >... </th> <td... >... </td> table data (or heading), which can span multiple cells, horizontally or vertically colspan= number-of-columns rowspan= number-of-rows <thead> heading <tbody> Optional elements of a table content block <tfoot> footer <caption> caption text describing the nature of the table Table: row, header, and data attributes align= horizontal-alignment left, center, right valign= vertical-alignment top, middle, bottom baseline bgcolor= color A.Lioy - Politecnico di Torino ( ) E-8
9 Table: column groups <colgroup span=n width= align= valign= > structural group of n columns, everyone with the specified attributes <col span=n width= align= valign= > definition of attributes for one or more columns Frames division of a page in zones whose content is specified by other HTML files deprecated (use CSS and include ) <head>... </head> <frameset...> <frame...> <frame...> <frame...> </frameset...> Frameset and Frame the structure of a page organised in frames is similar to the traditional one, replacing <body> with <frameset> it is possible to nest the FrameSet tags to create complex page subdivisions the content of every frame is specified through: <frame src=uri name=...> use the <noframe> tag for the text to be visualised by browsers not supporting frames Space spanned by frames it is possible to specify the portion of the page occupied by each frame, by using: percentage (of the available space) absolute value (in pixel) "*" to use all the remaining space in case of overflow the scrollbars (H & V) are activated example (subdivision in 3 horizontal frames): <frameset rows= 20%,50%,30% > examples (vertical subdivision): < frameset cols= 20%,80% > < frameset cols= 100,*,100 > Frame navigation links should indicate into which frame (or window) the target page should be visualised: <a href=uri target="name_of_a_frame"> </a> special values for target: "_blank" (new window) "_self" (in the same frame) = default "_parent" (higher order frameset) "_top" (span the entire window) Frame example (I) <! initial page --> <frameset rows="80%,20%"> <noframe> <p>the page cannot be shown</p> </noframe> <frameset cols="100,*"> <frame src="menu.html"> <frame src="p1.html" name="content"> </frameset> <frame src="footer.html"> </frameset> A.Lioy - Politecnico di Torino ( ) E-9
10 Frame example (II) <!-- menu.html --> <head>... </head> <body> <p><a href="p1.html" target="content">pag.1</a></p> <p><a href="p2 p2.html html" target="content">pag >Pag.2</a></p> <p><a href="p3.html" target="content">pag.3</a></p> </body> Inline frame (iframe) a frame handled as a single object (e.g. as an image) therefore, it can be placed at any point in the page initially supported only by IE syntax: <iframe src=uri >... </iframe> height= width= name= frameborder= marginwidth= marginheight= scrolling=yes/no/auto align= vspace= hspace= the text inside the tag is ignored by browsers supporting iframe, and visualised by the others (use it for error signalling) DIV and SPAN introduced in HTML 4.0 to group parts and apply formatting more easily DIV identifies a block (typically, browsers place a line break before and after a block) SPAN identifies a part inside a block frequently used to create (with an appropriate CSS) a page layout without using tables or frames id and class allow references from the CSS <div id="..." class="...">... </div> <span id="..." class="...">... </span> General attributes of HTML tags id = "string" anchor for a link reference to an element from a script reference to a field in a form reference for a specific style in CSS class = "class1 class2 " list of classes to be used e.g. as CSS selectors title = "title" visualised when pointing to the element lang = "language" for automatic text reading (values: en it fr de ) Favourite icon the little icon near the URL a 16 x 16 pixel image old browsers: only in MS icon format in a fixed position and with fixed name = /favicon.ico first step to standardization: <link rel="shortcut icon" href="/icons/my.ico" type="image/vnd.microsoft.icon"> new browsers support the de-facto standard: <link rel="icon" type="image/png" href="/icons/my.png"> A.Lioy - Politecnico di Torino ( ) E-10
HTML 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 informationCHAPTER 2 MARKUP LANGUAGES: XHTML 1.0
WEB TECHNOLOGIES A COMPUTER SCIENCE PERSPECTIVE CHAPTER 2 MARKUP LANGUAGES: XHTML 1.0 Modified by Ahmed Sallam Based on original slides by Jeffrey C. Jackson reserved. 0-13-185603-0 HTML HELLO WORLD! Document
More informationThe [HTML] Element p. 61 The [HEAD] Element p. 62 The [TITLE] Element p. 63 The [BODY] Element p. 66 HTML Elements p. 66 Core Attributes p.
Acknowledgments p. xix Preface p. xxi Web Basics Introduction to HTML p. 3 Basic HTML Concepts p. 4 HTML: A Structured Language p. 7 Overview of HTML Markup p. 11 Logical and Physical HTML p. 13 What HTML
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 informationIndex. CSS directive, # (octothorpe), intrapage links, 26
Holzschlag_.qxd 3/30/05 9:23 AM Page 299 Symbols @import CSS directive, 114-115 # (octothorpe), intrapage links, 26 A a element, 23, 163, 228 abbr element, 228 absolute keywords for font sizing, 144 absolute
More informationA HTML document has two sections 1) HEAD section and 2) BODY section A HTML file is saved with.html or.htm extension
HTML Website is a collection of web pages on a particular topic, or of a organization, individual, etc. It is stored on a computer on Internet called Web Server, WWW stands for World Wide Web, also called
More informationCertified HTML Designer VS-1027
VS-1027 Certification Code VS-1027 Certified HTML Designer Certified HTML Designer HTML Designer Certification allows organizations to easily develop website and other web based applications which are
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 informationINFS 2150 / 7150 Intro to Web Development / HTML Programming
XP Objectives INFS 2150 / 7150 Intro to Web Development / HTML Programming Designing a Web Page with Tables Create a text table Create a table using the , , and tags Create table headers
More informationCSI 3140 WWW Structures, Techniques and Standards. Markup Languages: XHTML 1.0
CSI 3140 WWW Structures, Techniques and Standards Markup Languages: XHTML 1.0 HTML Hello World! Document Type Declaration Document Instance Guy-Vincent Jourdan :: CSI 3140 :: based on Jeffrey C. Jackson
More informationCertified HTML5 Developer VS-1029
VS-1029 Certified HTML5 Developer Certification Code VS-1029 HTML5 Developer Certification enables candidates to develop websites and web based applications which are having an increased demand in the
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 informationInternet publishing HTML (XHTML) language. Petr Zámostný room: A-72a phone.:
Internet publishing HTML (XHTML) language Petr Zámostný room: A-72a phone.: 4222 e-mail: petr.zamostny@vscht.cz Essential HTML components Element element example Start tag Element content End tag
More informationOliver Pott HTML XML. new reference. Markt+Technik Verlag
Oliver Pott HTML XML new reference Markt+Technik Verlag Inhaltsverzeichnis Übersicht 13 14 A 15 A 16 ABBR 23 ABBR 23 ACCEPT 26 ACCEPT-CHARSET
More informationChapter 2:- Introduction to XHTML. Compiled By:- Sanjay Patel Assistant Professor, SVBIT.
Chapter 2:- Introduction to XHTML Compiled By:- Assistant Professor, SVBIT. Outline Introduction to XHTML Move to XHTML Meta tags Character entities Frames and frame sets Inside Browser What is XHTML?
More informationAdvanced Web Programming C2. Basic Web Technologies
Politehnica University of Timisoara Advanced Web Programming C2. Basic Web Technologies 2013 UPT-AC Assoc.Prof.Dr. Dan Pescaru HTML Originally developed by Tim Berners-Lee in 1990 at CERN (Conseil Européen
More informationFundamentals: Client/Server
Announcements Class Web Site: http://www.cs.umd.edu/projects/passport/classes/summer2008/ You can find this link at the end of the main passport site http://www.cs.umd.edu/projects/passport/webpage/ E-mail
More informationText and Layout. Digital Multimedia, 2nd edition Nigel Chapman & Jenny Chapman Chapter 11. This presentation 2004, MacAvon Media Productions
Text and Layout Digital Multimedia, 2nd edition Nigel Chapman & Jenny Chapman Chapter 11 This presentation 344 345 Text in Graphics Maximum flexibility obtained by treating text as graphics and manipulating
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 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 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 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 informationUNIT II Dynamic HTML and web designing
UNIT II Dynamic HTML and web designing HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language A markup language
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 informationrecall: 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 informationLearning Objectives. Review html Learn to write a basic webpage in html Understand what the basic building blocks of html are
HTML CSCI311 Learning Objectives Review html Learn to write a basic webpage in html Understand what the basic building blocks of html are HTML: Hypertext Markup Language HTML5 is new standard that replaces
More informationCSS for Styling CS380
1 CSS for Styling The good, the bad and the 2 ugly! shashdot. News for nerds!! You will never, ever be bored here!
More informationCSS: The Basics CISC 282 September 20, 2014
CSS: The Basics CISC 282 September 20, 2014 Style Sheets System for defining a document's style Used in many contexts Desktop publishing Markup languages Cascading Style Sheets (CSS) Style sheets for HTML
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 informationAnnouncements. Paper due this Wednesday
Announcements Paper due this Wednesday 1 Client and Server Client and server are two terms frequently used Client/Server Model Client/Server model when talking about software Client/Server model when talking
More informationintroduction to XHTML
introduction to XHTML XHTML stands for Extensible HyperText Markup Language and is based on HTML 4.0, incorporating XML. Due to this fusion the mark up language will remain compatible with existing browsers
More informationCascading Style Sheet Quick Reference
Computer Technology 8/9 Cascading Style Sheet Quick Reference Properties Properties are listed in alphabetical order. Each property has examples of possible values. Properties are not listed if they are
More informationHTML: Parsing Library
HTML: Parsing Library Version 4.1.3 November 20, 2008 (require html) The html library provides functions to read html documents and structures to represent them. (read-xhtml port) html? port : input-port?
More informationWeb Development & Design Foundations with XHTML. Chapter 2 Key Concepts
Web Development & Design Foundations with XHTML Chapter 2 Key Concepts Learning Outcomes In this chapter, you will learn about: XHTML syntax, tags, and document type definitions The anatomy of a web page
More informationChapter 1 Self Test. LATIHAN BAB 1. tjetjeprb{at}gmail{dot}com. webdesign/favorites.html :// / / / that houses that information. structure?
LATIHAN BAB 1 Chapter 1 Self Test 1. What is a web browser? 2. What does HTML stand for? 3. Identify the various parts of the following URL: http://www.mcgrawhill.com/books/ webdesign/favorites.html ://
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 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 informationCSS. Lecture 16 COMPSCI 111/111G SS 2018
CSS Lecture 16 COMPSCI 111/111G SS 2018 No CSS Styles A style changes the way the HTML code is displayed Same page displayed using different styles http://csszengarden.com Same page with a style sheet
More informationTables & Lists. Organized Data. R. Scott Granneman. Jans Carton
Tables & Lists Organized Data R. Scott Granneman Jans Carton 1.3 2014 R. Scott Granneman Last updated 2015-11-04 You are free to use this work, with certain restrictions. For full licensing information,
More informationROLE OF WEB BROWSING LAYOUT ENGINE EVALUATION IN DEVELOPMENT
INFORMATION AND COMMUNICATION TECHNOLOGIES ROLE OF WEB BROWSING LAYOUT ENGINE EVALUATION IN DEVELOPMENT PROCESS OF MORE USABLE WEB INFORMATION SYSTEM Gatis Vitols, Latvia University of Agriculture gatis.vitols@llu.lv;
More informationHTML TUTORIAL ONE. Understanding What XHTML is Not
HTML TUTORIAL ONE Defining Blended HTML, XHTML and CSS HTML: o Language used to create Web pages o Create code to describe structure of a Web page XHTM: o Variation of HTML o More strictly defines how
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 informationIntro to html. --- define every element, attribute, and entity along with the rules for their use
Notes September 14, 2010 Intro to html replace with your document's title
More informationA Brief Introduction to HTML
A P P E N D I X HTML SuMMAry J A Brief Introduction to HTML A web page is written in a language called HTML (Hypertext Markup Language). Like Java code, HTML code is made up of text that follows certain
More informationReading 2.2 Cascading Style Sheets
Reading 2.2 Cascading Style Sheets By Multiple authors, see citation after each section What is Cascading Style Sheets (CSS)? Cascading Style Sheets (CSS) is a style sheet language used for describing
More informationWML2.0 TUTORIAL. The XHTML Basic defined by the W3C is a proper subset of XHTML, which is a reformulation of HTML in XML.
http://www.tutorialspoint.com/wml/wml2_tutorial.htm WML2.0 TUTORIAL Copyright tutorialspoint.com WML2 is a language, which extends the syntax and semantics of the followings: XHTML Basic [ XHTMLBasic ]
More informationCSC 443: Web Programming
1 CSC 443: Web Programming Haidar Harmanani Department of Computer Science and Mathematics Lebanese American University Byblos, 1401 2010 Lebanon CSC443: Web Programming 2 for Styling The good, the bad
More information1.264 Lecture 12. HTML Introduction to FrontPage
1.264 Lecture 12 HTML Introduction to FrontPage HTML Subset of Structured Generalized Markup Language (SGML), a document description language SGML is ISO standard Current version of HTML is version 4.01
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 informationCSS Lecture 16 COMPSCI 111/111G SS 2018
No CSS CSS Lecture 16 COMPSCI 111/111G SS 2018 Styles Astyle changes the way the HTML code is displayed Same page displayed using different styles Same page with a style sheet body font-family: sans-serif;
More information@namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */ /* bidi */
/ BEGIN LICENSE BLOCK Version: MPL 1.1/GPL 2.0/LGPL 2.1 The contents of this file are subject to the Mozilla Public License Version 1.1 (the "License"); you may not use this file except in compliance with
More informationHTML-5.com itemscopehttp://data-vocabulary.org/breadcrumb<span itemprop="title">html 5</span> itemscopehttp://data-vocabulary.
HTML-5.com HTML-5.com is an HTML User's Guide and quick reference of HTML elements and attributes for web developers who code HTML web pages, not only for HTML 5 but for HTML coding in general, with demos
More information<body bgcolor=" " fgcolor=" " link=" " vlink=" " alink=" "> These body attributes have now been deprecated, and should not be used in XHTML.
CSS Formatting Background When HTML became popular among users who were not scientists, the limited formatting offered by the built-in tags was not enough for users who wanted a more artistic layout. Netscape,
More informationChapter 4. Introduction to XHTML: Part 1
Chapter 4. Introduction to XHTML: Part 1 XHTML is a markup language for identifying the elements of a page so a browser can render that page on a computer screen. Document presentation is generally separated
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 informationQUICK REFERENCE GUIDE
QUICK REFERENCE GUIDE New Selectors New Properties Animations 2D/3D Transformations Rounded Corners Shadow Effects Downloadable Fonts @ purgeru.deviantart.com WHAT IS HTML5? HTML5 is being developed as
More informationBasic Web Pages with XHTML (and a bit of CSS) CSE 190 M (Web Programming), Spring 2008 University of Washington Reading: Chapter 1, sections
Basic Web Pages with XHTML (and a bit of CSS) CSE 190 M (Web Programming), Spring 2008 University of Washington Reading: Chapter 1, sections 1.1-1.3 Except where otherwise noted, the contents of this presentation
More informationAppendix D CSS Properties and Values
HTML Appendix D CSS Properties and Values This appendix provides a brief review of Cascading Style Sheets (CSS) concepts and terminology, and lists CSS level 1 and 2 properties and values supported by
More informationADDING CSS TO YOUR HTML DOCUMENT. A FEW CSS VALUES (colour, size and the box model)
INTRO TO CSS RECAP HTML WHAT IS CSS ADDING CSS TO YOUR HTML DOCUMENT CSS IN THE DIRECTORY TREE CSS RULES A FEW CSS VALUES (colour, size and the box model) CSS SELECTORS SPECIFICITY WEEK 1 HTML In Week
More informationHTML BEGINNING TAGS. HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html>
HTML BEGINNING TAGS HTML Structure Web page content Structure tags: Tags used to give structure to the document.
More informationCOMSC-030 Web Site Development- Part 1. Part-Time Instructor: Joenil Mistal
COMSC-030 Web Site Development- Part 1 Part-Time Instructor: Joenil Mistal Chapter 9 9 Working with Tables Are you looking for a method to organize data on a page? Need a way to control our page layout?
More information</HTML> </HEAD> </BODY> </TITLE> </I> </B> </U> </BLINK> </EM> </FONT> </FONT> </CENTER> </H1> </H2> </H3> </P> </BR> --!>
HTML - hypertext mark-up language HTML is a standard hypertext language for the WWW and has several different versions. Most WWW browsers support HTML 2 and most of new versions of the browsers support
More informationHTML: Parsing Library
HTML: Parsing Library Version 6.7 October 26, 2016 (require html) package: html-lib The html library provides functions to read conformant HTML4 documents and structures to represent them. Since html assumes
More informationCS144 Notes: Web Standards
CS144 Notes: Web Standards Basic interaction Example: http://www.youtube.com - Q: what is going on behind the scene? * Q: What entities are involved in this interaction? * Q: What is the role of each entity?
More informationIntroduction to Web Design CSS Reference
Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:
More informationIntroduction to Web Design CSS Reference
Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:
More informationWeb Publishing Basics I
Web Publishing Basics I Jeff Pankin Information Services and Technology Contents Course Objectives... 2 Creating a Web Page with HTML... 3 What is Dreamweaver?... 3 What is HTML?... 3 What are the basic
More informationSummary 4/5. (contains info about the html)
Summary Tag Info Version Attributes Comment 4/5
More informationBasics of Web Design, 3 rd Edition Instructor Materials Chapter 2 Test Bank
Multiple Choice. Choose the best answer. 1. What element is used to configure a new paragraph? a. new b. paragraph c. p d. div 2. What element is used to create the largest heading? a. h1 b. h9 c. head
More informationHYPERTEXT MARKUP LANGUAGE ( HTML )
1 HTML BASICS MARK-UP LANGUAGES Traditionally used to provide typesetting information to printers where text should be indented, margin sizes, bold text, special font sizes and styles, etc. Word processors
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 informationTutorial 2 - HTML basics
Tutorial 2 - HTML basics Developing a Web Site The first phase in creating a new web site is planning. This involves determining the site s navigation structure, content, and page layout. It is only after
More informationCMPT 165 INTRODUCTION TO THE INTERNET AND THE WORLD WIDE WEB
CMPT 165 INTRODUCTION TO THE INTERNET AND THE WORLD WIDE WEB Unit 3 Cascading Style Sheets (CSS) Slides based on course material SFU Icons their respective owners 1 Learning Objectives In this unit you
More information2.1 Origins and Evolution of HTML
2.1 Origins and Evolution of HTML - HTML was defined with SGML - Original intent of HTML: General layout of documents that could be displayed by a wide variety of computers - Recent versions: - HTML 4.0
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 informationINTRODUCTION TO HTML5! HTML5 Page Structure!
INTRODUCTION TO HTML5! HTML5 Page Structure! What is HTML5? HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. The previous version of HTML came in 1999. The web has changed a lot since
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 informationBeginning Web Programming with HTML, XHTML, and CSS. Second Edition. Jon Duckett
Beginning Web Programming with HTML, XHTML, and CSS Second Edition Jon Duckett Beginning Web Programming with HTML, XHTML, and CSS Introduction............................................... xxiii Chapter
More informationIndian Institute of Technology Kharagpur. HTML Part III. Prof. Indranil Sen Gupta Dept. of Computer Science & Engg. I.I.T.
Indian Institute of Technology Kharagpur HTML Part III Prof. Indranil Sen Gupta Dept. of Computer Science & Engg. I.I.T. Kharagpur, INDIA Lecture 15: HTML Part III On completion, the student will be able
More informationAdvanced HTML Scripting WebGUI Users Conference
Advanced HTML Scripting 2004 WebGUI Users Conference XHTML where did that x come from? XHTML =? Extensible Hypertext Markup Language Combination of HTML and XML More strict than HTML Things to Remember
More informationWeb Development & Design Foundations with HTML5 & CSS3 Instructor Materials Chapter 2 Test Bank
Multiple Choice. Choose the best answer. 1. What tag pair is used to create a new paragraph? a. b. c. d. 2. What tag pair
More informationHTML/XML. HTML Continued Introduction to CSS
HTML/XML HTML Continued Introduction to CSS Entities Special Characters Symbols such as +, -, %, and & are used frequently. Not all Web browsers display these symbols correctly. HTML uses a little computer
More informationOutline. Link HTML With Style Sheets &6&7XWRULDO &66 ;+70/ (GZDUG;LD
&6&7XWRULDO &66 ;+70/ (GZDUG;LD Outline CSS Link XHTML With Style Sheets, Class/ID selectors, Pseudo-class/element, Color values, Length units, Text, Font, Lists, Padding/border/margin, Floating/clearing,
More informationIntroducing Web Tables
TABLE AND FRAMESET Introducing Web Tables A table can be displayed on a Web page either in a text or graphical format. A text table: Contains only text, evenly spaced on the Web page in rows and columns
More informationChapter 5. Introduction to XHTML: Part 2
Chapter 5. Introduction to XHTML: Part 2 Tables Attributes of the table element: border: width of the table border in pixels (0 makes all lines invisible) align: horizontal alignment (left, center, or
More informationCS 350 COMPUTER/HUMAN INTERACTION. Lecture 6
CS 350 COMPUTER/HUMAN INTERACTION Lecture 6 Setting up PPP webpage Log into lab Linux client or into csserver directly Webspace (www_home) should be set up Change directory for CS 350 assignments cp r
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 informationCopyright 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley. Chapter 2 Introduction to XHTML
Chapter 2 Introduction to XHTML 2.1 Origins and Evolution of HTML HTML was defined with SGML Original intent of HTML: General layout of documents that could be displayed by a wide variety of computers
More information2.1 Origins and Evolution of HTML. 2.3 HTML Document Structure
Chapter 2 Introduction to XHTML 2.1 Origins and Evolution of HTML HTML was defined with SGML Original intent of HTML: General layout of documents that could be displayed by a wide variety of computers
More informationHTML & CSS. SWE 432, Fall 2017 Design and Implementation of Software for the Web
HTML & CSS SWE 432, Fall 2017 Design and Implementation of Software for the Web HTML: HyperText Markup Language LaToza Language for describing structure of a document Denotes hierarchy of elements What
More informationChapter 4 Notes. Creating Tables in a Website
Chapter 4 Notes Creating Tables in a Website Project for Chapter 4 Statewide Realty Web Site Chapter Objectives Define table elements Describe the steps used to plan, design, and code a table Create a
More informationHTML & XHTML Tag Quick Reference
HTML & XHTML Tag Quick Reference This reference notes some of the most commonly used HTML and XHTML tags. It is not, nor is it intended to be, a comprehensive list of available tags. Details regarding
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 informationCSS. (Cascading Style Sheets) HTML (Hyper Text Markup Language) HTML: styles. 07/07/2011(mar'09) A.Lioy - Politecnico di Torino ( ) F.
CSS (Cascading Style Sheets) Antonio Lioy < lioy@polito.it it > english version created by Marco D. Aime < m.aime@polito.it > Politecnico di Torino Dip. Automatica e Informatica HTML (Hyper Text Markup
More informationTable-Based Web Pages
Table-Based Web Pages Web Authoring and Design Benjamin Kenwright Outline What do we mean by Table-Based Web Sites? Review Table Tags/Structure Tips/Debugging/Applications Summary Review/Discussion Submissions/Quizzes/GitHub
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 informationSymbols INDEX. !important rule, rule, , 146, , rule,
Symbols!important rule, 209 @import rule, 140-144, 146, 155-156, 157 @media rule, 155-156 A element. See anchors abbr attribute, 36-37 element, 87, 90-91 absolute positioning, 177, 178, 182,
More informationShatin Tsung Tsin Secondary School S.3 Computer and Technology Web Page Design by HTML Introduction to HTML
Shatin Tsung Tsin Secondary School S.3 Computer and Technology Web Page Design by HTML Introduction to HTML HTML (Hyper Text Markup Language) is the set of markup symbols (tags or codes) (e.g. , ,
More informationHTML (Hyper Text Markup Language) CSS. (Cascading Style Sheets) HTML: problems with styles. HTML: styles. CSS: specifications.
CSS (Cascading Style Sheets) Antonio Lioy < lioy@polito.it it > english version created by Marco D. Aime < m.aime@polito.it > Politecnico di Torino Dip. Automatica e Informatica HTML (Hyper Text Markup
More informationBasic HTML. Lecture 14. Robb T. Koether. Hampden-Sydney College. Wed, Feb 20, 2013
Basic HTML Lecture 14 Robb T. Koether Hampden-Sydney College Wed, Feb 20, 2013 Robb T. Koether (Hampden-Sydney College) Basic HTML Wed, Feb 20, 2013 1 / 26 1 HTML 2 HTML File Structure 3 HTML Elements
More information