120 likes | 296 Views
HTML/CSS Session 1. Mostafa Sotoodeh Moghadam. This Session Consist :. Markup Languages What is Html ? What is CSS ? What do we need for programming in HTML/CSS ? How we can Run a Program in HTML/CSS ? Sample Code in HTML < DOCTYPE >. Markup Languages.
E N D
HTML/CSSSession 1 Mostafa Sotoodeh Moghadam
This Session Consist : Markup Languages What is Html ? What is CSS ? What do we need for programming in HTML/CSS ? How we can Run a Program in HTML/CSS ? Sample Code in HTML <DOCTYPE>
Markup Languages A markup languageis a modern system for annotating a document in a way that is syntactically distinguishable from the text. The idea and terminology evolved from the "marking up" of manuscripts, i.e., the revision instructions by editors, traditionally written with a blue pencil on authors' manuscripts. Examples are typesetting instructions such as those found in troff and LaTeX, or structural markers such as XML tags. Markup is typically omitted from the version of the text that is displayed for end-user consumption.
Markup Languages Some markup languages, such as HTML, have presentation semantics, meaning that their specification prescribes how the structured data are to be presented, but other markup languages, like XML, have no predefined semantics. A well-known example of a markup language in widespread use today is HyperText Markup Language (HTML), one of the document formats of the World Wide Web(WWW).
What is Html ? HyperText Markup Language (HTML) is the main markup language for web pages. HTML elements are the basic building-blocks of webpages. HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like <html>), within the web page content.
What is CSS ? Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation semantics (the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.
What do We need for… ? We all knows that for programming we need a application for developing (a environment for typing our code in there) or (Integrated development environment) - IDE. We can Develop HTML in every IDE that you can Imagine. Such as : Notepad , Notepad++ , Microsoft word , etc. But there are some professional IDE for HTML/CSS,such as : Dreamweaver or Komodo(Windows) BlueFish or Komodo(Linux) Dreamweaver or netBeans(Mac) There are other IDEs but the top of them are mentioned.
How we can Run … ? We realize that there so many IDEs for developing HTML/CSS. Now we want to Run our Program. But there is no Compiler for HTML/CSS !!!!!!!!!! SO… We Just Can Use our Browsers for seeing our result of program. How ? HTML/CSS don’t need a compiler. This language is hypertext so we need a interpreter. Our code is interpret by our browsers, and there is a Big Problem for us in WEB DEVELOPING : Every browser interpret our code by its factors. So we can find out our web page different in different browsers!!!!
Sample Code… <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>HTML/CSS</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <p> This is the Sample </p> </body> </html>
<!DOCTYPE> The <!DOCTYPE> declaration must be the very first thing in your HTML document, before the <html> tag. The <!DOCTYPE> declaration is not an HTML tag; it is an instruction to the web browser about what version of HTML the page is written in. The <!DOCTYPE> declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly. Tip: Always add the <!DOCTYPE> declaration to your HTML documents, so that the browser knows what type of document to expect.
<!DOCTYPE> - types HTML 4.01 Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> HTML 4.01 Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> HTML 4.01 Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">