Syllabus - July to Sept
|
|
- Adela Harrington
- 6 years ago
- Views:
Transcription
1 Class IX Sub: Computer Syllabus - July to Sept What is www: The World Wide Web (www, W3) is an information space where documents and other web resources are identified by URIs, interlinked by hypertext links, and can be accessed via the Internet. It has become known simply as the Web. Header The <header> element represents a container for introductory content or a set of navigational links. A <header> element typically contains: one or more heading elements (<h1> - <h6>) logo or icon You can have several <header> elements in one document.
2 HTML Headings Headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading. <h6> defines the least important heading. Example <h1>heading 1</h1> <h2>heading 2</h2> <h3>heading 3</h3> <h4>heading 4</h4> <h5>heading 5</h5> <h6>heading 6</h6> Result of Above Example Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 HTML Tag The tag defines the document's body. The element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc The HTML <title> Element The <title> tag defines the title of the document. A simplified HTML document:
3 <head> <title>title of the document</title> </head> The content of the document... HTML Paragraphs The HTML <p> element defines a paragraph Example : <p>this is a paragraph.</p> <p>this is a paragraph.</p> <p>this is a paragraph.</p> Result of Above Program: This is a paragraph. This is a paragraph. This is a paragraph. HTML Tables Tables are defined with the <table> tag. A table is divided into rows with the <tr> tag. (tr stands for table row) A row is divided into data cells with the <td> tag. (td stands for table data) A row can also be divided into headings with the <th> tag. (th stands for table heading)
4 <head> Sample Table </head> <table border="1"> <tr> <th>state</th> <th>capital</th> </tr> <tr> <td>maharashtra</td> <td>mumbai</td> </tr> <tr> <td>gujrat</td> <td>gandhinagar</td> </tr> </table> Result of Above Program Sample Table State Maharashtra Gujrat Mumbai Capital Gandhinagar HTML Lists The most common HTML lists are ordered and unordered lists: HTML Lists An ordered list: 1. The first list item 2. The second list item 3. The third list item An unordered list: List item List item List item HTML Unordered Lists An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. The list items are marked with bullets (typically small black circles).
5 <ul> <li>coffee</li> <li>milk</li> </ul> How the HTML code above looks in a browser: Coffee Milk HTML Ordered Lists An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items are marked with numbers. <ol> <li>coffee</li> <li>milk</li> </ol> How the HTML code above looks in a browser: 1. Coffee 2. Milk Styling HTML Elements CSS (Cascading Style Sheets) was introduced in December 1996 by the W3C, to provide a better way to style HTML elements. With CSS, it becomes easy to specify the colors used for the text and the backgrounds, the size and the style for the fonts, the amount of space between elements, adding border and outlines to the elements and a host of other styling. Adding Styles to HTML Elements Style information can be either attached as a separate document or embedded in the HTML document. These are the three methods of implementing styling information to the HTML document (from highest to lowest priority). Inline styles Using the style attribute in the HTML start tag. Embedded style Using the <style> element in the head section of the document. External style sheet Using the <link> element, pointing to an external CSS files.
6 Inline Styles Inline styles are used to apply the unique style rules to an element by putting the CSS rules directly into the start tag. It can be attached to an element using the style attribute. The style attribute includes a series of CSS property and value pairs. Each property: value pair is separated by a semicolon (;), just as you would write into an embedded or external style sheet. But it needs to be all in one line i.e. no line break after the semicolon. The following example will show you how to change the color and fontsize of the text: <head> <title>example of HTML Inline Styles</title> </head> <h1 style="color:red;font-size:30px;"> This is a heading </h1> <p style="color:green;font-size:18px;"> This is a paragraph. </p> <hr style="border-color:blue;"> Output of Above Program: This is a heading This is a paragraph. Embedded Style Sheets Embedded or internal style sheets only affect the document they are embedded in. Embedded style sheets are defined in the <head> section of an HTML document using the <style> tag. You can define any number of <style> elements inside the <head> section of an HTML document. See the example below:
7 <head> <title>example of HTML Embedded Style Sheet</title> <style type="text/css"> body { background-color: YellowGreen; h1 { color: red; p { color: green; </style> </head> <h1>this is a heading</h1> <p>this is a paragraph.</p> External Style Sheets An external style sheet is ideal when the style is applied to many pages. An external style sheet holds all the style rules in a separate document that you can link from any HTML file on your site. External style sheets are the most flexible because with an external style sheet, you can change the look of an entire website by changing just one file. You can attach external style sheets in two ways linking and importing: Linking External Style Sheets An external style sheet can be linked to an HTML document using the <link> tag. The <link> tag goes inside the <head> section: <head> <title>example of HTML External Style Sheet</title> <link rel="stylesheet" type="text/css" href="/examples/css/style.css"> </head> <h1>linking External Style Sheet</h1> <p>the styles of this HTML document are defined in linked style sheet.</p>
8 Output of Above Program: Linking External Style Sheet The styles of this HTML document are defined in linked style sheet. Styling HTML with CSS CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once. CSS can be added to HTML elements in 3 ways: Inline - by using the style attribute in HTML elements Internal - by using a <style> element in the <head> section External - by using an external CSS file The most common way to add CSS, is to keep the styles in separate CSS files. However, here we will use inline and internal styling, because this is easier to demonstrate, and easier for you to try it yourself. Inline CSS An inline CSS is used to apply a unique style to a single HTML element. An inline CSS uses the style attribute of an HTML element. This example sets the text color of the <h1> element to blue: <h1 style="color:blue;">this is a Blue Heading</h1>
9 OutPut: This is a Blue Heading Internal CSS An internal CSS is used to define a style for a single HTML page. An internal CSS is defined in the <head> section of an HTML page, within a <style> element: <head> <style> body {background-color: powderblue; h1 {color: blue; p {color: red; </style> </head> <h1>this is a heading</h1> <p>this is a paragraph.</p> OutPut External CSS: An external style sheet is used to define the style for many HTML pages.
10 With an external style sheet, you can change the look of an entire web site, by changing one file! To use an external style sheet, add a link to it in the <head> section of the HTML page: <head> <link rel="stylesheet" href="styles.css"> </head> <h1>this is a heading</h1> <p>this is a paragraph.</p> Output This is a heading This is a paragraph. An external style sheet can be written in any text editor. The file must not contain any HTML code, and must be saved with a.css extension. Here is how the "styles.css" looks: body { background-color: powderblue; h1 { color: blue; p { color: red; CSS Fonts The CSS color property defines the text color to be used. The CSS font-family property defines the font to be used. The CSS font-size property defines the text size to be used.
11 <head> <style> h1 { color: blue; font-family: verdana; font-size: 300%; p { color: red; font-family: courier; font-size: 160%; </style> </head> <h1>this is a heading</h1> <p>this is a paragraph.</p> CSS Border The CSS border property defines a border around an HTML element: Example p { border: 1px solid powderblue; CSS Margin The CSS margin property defines a margin (space) outside the border: Example p { border: 1px solid powderblue; margin: 50px;
12 The Id Attribute To define a specific style for one special element, add an id attribute to the element: <p id="p01">i am different</p> then define a style for the element with the specific id: Example #p01 { color: blue; The class Attribute To define a style for a special type of elements, add a class attribute to the element: <p class="error">i am different</p> then define a style for the elements with the specific class: Example p.error { color: red; Syllabus Oct-Dec JavaScript Introduction JavaScript is the most popular programming language in the world.
13 It is the language for HTML, for the Web, for computers, servers, laptops, tablets, smart phones, and more. Why Study JavaScript? JavaScript is one of 3 languages all web developers MUST learn: 1. HTML to define the content of web pages 2. CSS to specify the layout of web pages 3. JavaScript to program the behavior of web pages. A brief history of JavaScript JavaScript was created by Brendan Eich in 1995 during his time at Netscape Communications. Where JavaScript is used JavaScript is used to create interactive websites. It is mainly used for: o o o o o Client-side validation Dynamic drop-down menus Displaying data and time Displaying popup windows and dialog boxes (like alert dialog box, confirm dialog box and prompt dialog box) Displaying clocks etc. JavaScript Syntax JavaScript can be implemented using JavaScript statements that are placed within the <script>.... You can place the <script> tags, containing your JavaScript, anywhere within your web page, but it is normally recommended that you should keep it within the <head> tags. Your First JavaScript Program <script language="javascript" type="text/javascript"> document.write("hello World!")
14 Output: Hello World Enabling JavaScript in Browsers JavaScript in Internet Explorer Here are simple steps to turn on or turn off JavaScript in your Internet Explorer Follow Tools Internet Options from the menu. Select Security tab from the dialog box. Click the Custom Level button. Scroll down till you find Scripting option. Select Enable radio button under Active scripting. Finally click OK and come out To disable JavaScript support in your Internet Explorer, you need to select Disable radio button under Active scripting. JavaScript - Variables Like many other programming languages, JavaScript has variables. Variables can be thought of as named containers. You can place data into these containers and then refer to the data simply by naming the container. Before you use a variable in a JavaScript program, you must declare it. Variables are declared with the var keyword as follows. <script type="text/javascript"> <!-- var money; var name; //--> You can also declare multiple variables with the same var keyword as follows <script type="text/javascript"> <!-- var money, name; //-->
15 Storing a value in a variable is called variable initialization. You can do variable initialization at the time of variable creation or at a later point in time when you need that variable. JavaScript Variable Scope The scope of a variable is the region of your program in which it is defined. JavaScript variables have only two scopes. Global Variables A global variable has global scope which means it can be defined anywhere in your JavaScript code. Local Variables A local variable will be visible only within a function where it is defined. Function parameters are always local to that function. What is an operator? Let us take a simple expression is equal to 9. Here 4 and 5 are called operands and + is called the operator. JavaScript supports the following types of operators. Types of Operators 1. Logical Operators 2. Arithmetic Operators 3. Relational Operators JavaScript Logical Operators Operator Description && logical and logical or! logical not JavaScript Arithmetic Operators Arithmetic operators are used to perform arithmetic on numbers: Operator Description + Addition - Subtraction * Multiplication / Division % Modulus (Remainder) ++ Increment -- Decrement
16 JavaScript Comparison Operators Operator Description == equal to === equal value and equal type!= not equal!== not equal value or not equal type > greater than < less than >= greater than or equal to <= less than or equal to? ternary operator JavaScript - if...else Statement While writing a program, there may be a situation when you need to adopt one out of a given set of paths. In such cases, you need to use conditional statements that allow your program to make correct decisions and perform right actions. if statement The if statement is the fundamental control statement that allows JavaScript to make decisions and execute statements conditionally. Syntax The syntax for a basic if statement is as follows if (expression){ Statement(s) to be executed if expression is true Example Try the following example to understand how the if statement works. <script type="text/javascript"> <!-- var age = 20; if( age > 18 ){ document.write("<b>qualifies for driving</b>"); //--> <p>set the variable to different value and then try...</p>
17 Output Qualifies for driving Set the variable to different value and then try... if...else statement: The 'if...else' statement is the next form of control statement that allows JavaScript to execute statements in a more controlled way. Syntax if (expression){ Statement(s) to be executed if expression is true else{ Statement(s) to be executed if expression is false Here JavaScript expression is evaluated. If the resulting value is true, the given statement(s) in the if block, are executed. If the expression is false, then the given statement(s) in the else block are executed. Example Try the following code to learn how to implement an if-else statement in JavaScript. <script type="text/javascript"> <!-- var age = 15; if( age > 18 ){ document.write("<b>qualifies for driving</b>"); else{ document.write("<b>does not qualify for driving</b>"); //--> <p>set the variable to different value and then try...</p> Output Does not qualify for driving Set the variable to different value and then try...
18 JavaScript - Switch Case Syntax The objective of a switch statement is to give an expression to evaluate and several different statements to execute based on the value of the expression. The interpreter checks each case against the value of the expression until a match is found. If nothing matches, a default condition will be used. switch (expression) { case condition 1: statement(s) break; case condition 2: statement(s) break;... case condition n: statement(s) break; default: statement(s) The break statements indicate the end of a particular case. If they were omitted, the interpreter would continue executing each statement in each of the following cases. We will explain break statement in Loop Control chapter. Example Try the following example to implement switch-case statement. <script type="text/javascript"> <!-- var grade='a'; document.write("entering switch block<br />"); switch (grade) { case 'A': document.write("good job<br />"); break; case 'B': document.write("pretty good<br />"); break; case 'C': document.write("passed<br />"); break; case 'D': document.write("not so good<br />");
19 break; case 'F': document.write("failed<br />"); break; default: document.write("unknown grade<br />") document.write("exiting switch block"); //--> <p>set the variable to different value and then try...</p> Output Entering switch block Good job Exiting switch block Set the variable to different value and then try... Break statements play a major role in switch-case statements. Try the following code that uses switch-case statement without any break statement. <script type="text/javascript"> <!-- var grade='a'; document.write("entering switch block<br />"); switch (grade) { case 'A': document.write("good job<br />"); case 'B': document.write("pretty good<br />"); case 'C': document.write("passed<br />"); case 'D': document.write("not so good<br />"); case 'F': document.write("failed<br />"); default: document.write("unknown grade<br />") document.write("exiting switch block"); //--> <p>set the variable to different value and then try...</p> Output Entering switch block Good job Pretty good Passed Not so good Failed Unknown grade Exiting switch block
20 Set the variable to different value and then try... JavaScript For Loop Loops can execute a block of code a number of times. JavaScript Loops Loops are handy, if you want to run the same code over and over again, each time with a different value. Often this is the case when working with arrays: Instead of writing: text += cars[0] + "<br>"; text += cars[1] + "<br>"; text += cars[2] + "<br>"; text += cars[3] + "<br>"; text += cars[4] + "<br>"; text += cars[5] + "<br>"; You can write: <h2>javascript Loops</h2> <p id="demo"></p> <script> var cars = ["BMW", "Volvo", "Saab", "Ford", "Fiat", "Audi"]; var text = ""; var i; for (i = 0; i < cars.length; i++) { text += cars[i] + "<br>"; document.getelementbyid("demo").innerhtml = text; Different Kinds of Loops JavaScript supports different kinds of loops: for - loops through a block of code a number of times
21 for/in - loops through the properties of an object while - loops through a block of code while a specified condition is true do/while - also loops through a block of code while a specified condition is true Window Object Methods & POP UP Boxes Some object Methods with examples are as follows: Method alert() confirm() open() print() Description Displays an alert box with a message and an OK button Displays a dialog box with a message and an OK and a Cancel button Opens a new browser window Prints the content of the current window Example of alert() <p>click the button to display an alert box.</p> <button onclick="myfunction()">try it</button> <script> function myfunction() { alert("hello! I am an alert box!"); Example of Confirm() <p>click the button to display a confirm box.</p> <button onclick="myfunction()">try it</button> <script> function myfunction() { confirm("press a button!");
22 Example of open() <p>click the button to open a new browser window.</p> <button onclick="myfunction()">try it</button> <script> function myfunction() { window.open(" Example of print() <p>click the button to print the current page.</p> <button onclick="myfunction()">print this page</button> <script> function myfunction() { window.print();
Web Programming HTML CSS JavaScript Step by step Exercises Hans-Petter Halvorsen
https://www.halvorsen.blog Web Programming HTML CSS JavaScript Step by step Exercises Hans-Petter Halvorsen History of the Web Internet (1960s) World Wide Web - WWW (1991) First Web Browser - Netscape,
More informationWhat is CSS? NAME: INSERT OPENING GRAPHIC HERE:
What is CSS? NAME: INSERT OPENING GRAPHIC HERE: Highlight VOCABULARY WORDS that you need defined. Put a? mark in any area that you need clarified. 1 What is CSS? CSS stands for Cascading Style Sheets Styles
More informationCSS how to display to solve a problem External Style Sheets CSS files
WEB DESIGN What is 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
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 informationWeb Designing HTML5 NOTES
Web Designing HTML5 NOTES HTML Introduction What is HTML? HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text Markup Language HTML describes the structure of Web pages
More informationHTML Text Formatting. HTML Session 2 2
HTML Session 2 HTML Text Formatting HTML also defines special elements for defining text with a special meaning. - Bold text - Important text - Italic text - Emphasized text
More informationWEBSITE DESIGNING. Web designing has direct link to visual aspect of a web site. Effective web design is necessary to communicate ideas effectively.
WEBSITE DESIGNING http://www.tutorialspoint.com/internet_technologies/website_designing.htm Copyright tutorialspoint.com Web designing has direct link to visual aspect of a web site. Effective web design
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 informationUsing Dreamweaver CS6
6 So far we have used CSS to arrange the elements on our web page. We have also used CSS for some limited formatting. In this section we will take full advantage of using CSS to format our web site. Just
More informationCascading style sheets, HTML, DOM and Javascript
CSS Dynamic HTML Cascading style sheets, HTML, DOM and Javascript DHTML Collection of technologies forming dynamic clients HTML (content content) DOM (data structure) JavaScript (behaviour) Cascading Style
More informationTizen Web UI Technologies (Tizen Ver. 2.3)
Tizen Web UI Technologies (Tizen Ver. 2.3) Spring 2015 Soo Dong Kim, Ph.D. Professor, Department of Computer Science Software Engineering Laboratory Soongsil University Office 02-820-0909 Mobile 010-7392-2220
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 informationWhat is Java Script? Writing to The HTML Document. What Can JavaScript do? CMPT 165: Java Script
What is Java Script? CMPT 165: Java Script Tamara Smyth, tamaras@cs.sfu.ca School of Computing Science, Simon Fraser University November 7, 2011 JavaScript was designed to add interactivity to HTML pages
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 informationCGS 3066: Spring 2015 JavaScript Reference
CGS 3066: Spring 2015 JavaScript Reference Can also be used as a study guide. Only covers topics discussed in class. 1 Introduction JavaScript is a scripting language produced by Netscape for use within
More informationHTML Hyperlinks (Links)
WEB DESIGN HTML Hyperlinks (Links) The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you can click on to jump to another document. When you move the
More informationCOMS W3101: SCRIPTING LANGUAGES: JAVASCRIPT (FALL 2017)
COMS W3101: SCRIPTING LANGUAGES: JAVASCRIPT (FALL 2017) RAMANA ISUKAPALLI RAMANA@CS.COLUMBIA.EDU 1 LECTURE-1 Course overview See http://www.cs.columbia.edu/~ramana Overview of HTML Formatting, headings,
More informationBasic CSS Lecture 17
Basic CSS Lecture 17 Robb T. Koether Hampden-Sydney College Wed, Feb 21, 2018 Robb T. Koether (Hampden-Sydney College) Basic CSSLecture 17 Wed, Feb 21, 2018 1 / 22 1 CSS 2 Background Styles 3 Text Styles
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 informationUsing Dreamweaver CC. Logo. 4 Creating a Template. Page Heading. Page content in this area. About Us Gallery Ordering Contact Us Links
Using Dreamweaver CC 4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan shown below.
More informationUsing Dreamweaver CS6
Using Dreamweaver CS6 4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan shown below.
More informationIntroduction to Web Technologies
Introduction to Web Technologies James Curran and Tara Murphy 16th April, 2009 The Internet CGI Web services HTML and CSS 2 The Internet is a network of networks ˆ The Internet is the descendant of ARPANET
More informationBIM222 Internet Programming
BIM222 Internet Programming Week 7 Cascading Style Sheets (CSS) Adding Style to your Pages Part II March 20, 2018 Review: What is CSS? CSS stands for Cascading Style Sheets CSS describes how HTML elements
More informationCITS1231 Web Technologies. JavaScript
CITS1231 Web Technologies JavaScript Contents Introduction to JavaScript Variables Operators Conditional Statements Program Loops Popup Boxes Functions 2 User Interaction User interaction requires web
More informationUsing Dreamweaver. 6 Styles in Websites. 1. Linked or Imported Stylesheets. 2. Embedded Styles. 3. Inline Styles
Using Dreamweaver 6 So far these exercises have deliberately avoided using HTML s formatting options such as the FONT tag. This is because the basic formatting available in HTML has been made largely redundant
More informationMarkup Language SGML: Standard Generalized Markup Language. HyperText Markup Language (HTML) extensible Markup Language (XML) TeX LaTeX
HTML 1 Markup Languages A Markup Language is a computer language in which data and instructions describing the structure and formatting of the data are embedded in the same file. The term derives from
More informationIntroduction to HTML. SSE 3200 Web-based Services. Michigan Technological University Nilufer Onder
Introduction to HTML SSE 3200 Web-based Services Michigan Technological University Nilufer Onder What is HTML? Acronym for: HyperText Markup Language HyperText refers to text that can initiate jumps to
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 informationLesson 5 Introduction to Cascading Style Sheets
Introduction to Cascading Style Sheets HTML and JavaScript BASICS, 4 th Edition 1 Objectives Create a Cascading Style Sheet. Control hyperlink behavior with CSS. Create style classes. Share style classes
More informationClient Side Concepts Quiz Solution
Client Side Concepts Quiz Solution Who invented the World Wide Web? A) Tim Berners Lee B) Bruce Lee C) Brett Lee D) Jerry Kabell Who is making the Web standards? A) Microsoft B) Mozilla C) The World Wide
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 informationCSS. M hiwa ahamad aziz Raparin univercity. 1 Web Design: Lecturer ( m hiwa ahmad aziz)
CSS M hiwa ahamad aziz www.raparinweb.fulba.com Raparin univercity 1 What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve
More informationHTML Images - The <img> Tag and the Src Attribute
WEB DESIGN HTML Images - The Tag and the Src Attribute In HTML, images are defined with the tag. The tag is empty, which means that it contains attributes only, and has no closing tag.
More informationc122jan2714.notebook January 27, 2014
Internet Developer 1 Start here! 2 3 Right click on screen and select View page source if you are in Firefox tells the browser you are using html. Next we have the tag and at the
More informationReview Question 1. Which tag is used to create a link to another page? 1. <p> 2. <li> 3. <a> 4. <em>
Introduction to CSS Review Question 1 Which tag is used to create a link to another page? 1. 2. 3. 4. Review Question 1 Which tag is used to create a link to another page? 1. 2.
More informationCST272 ASP.NET Style Sheets Page 1
CST272 ASP.NET Style Sheets Page 1 1 2 3 4 5 6 Style Sheets in ASP.NET CST272 ASP.NET Creating Cascading Style Sheets (CSS) Stores information on how to present the site Cascading style sheets allow content
More informationHTML, CSS, JavaScript
HTML, CSS, JavaScript Encoding Information: There s more! Bits and bytes encode the information, but that s not all Tags encode format and some structure in word processors Tags encode format and some
More informationWeb Programming Week 2 Semester Byron Fisher 2018
Web Programming Week 2 Semester 1-2018 Byron Fisher 2018 INTRODUCTION Welcome to Week 2! In the next 60 minutes you will be learning about basic Web Programming with a view to creating your own ecommerce
More informationINFORMATICA GENERALE 2014/2015 LINGUAGGI DI MARKUP CSS
INFORMATICA GENERALE 2014/2015 LINGUAGGI DI MARKUP CSS cristina gena dipartimento di informatica cgena@di.unito.it http://www.di.unito.it/~cgena/ materiale e info sul corso http://www.di.unito.it/~cgena/teaching.html
More informationThree Ways to Use CSS:
Introduction to CSS CSS Defined: Short for "Cascading Style Sheets". Determines how the elements in our XHTML documents are displayed and formatted. Designed to separate the content of a web page from
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 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 informationChapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21
Table of Contents Chapter 1 Getting Started with HTML 5 1 Introduction to HTML 5... 2 New API... 2 New Structure... 3 New Markup Elements and Attributes... 3 New Form Elements and Attributes... 4 Geolocation...
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 informationComp-206 : Introduction to Software Systems Lecture 23. Alexandre Denault Computer Science McGill University Fall 2006
HTML, CSS Comp-206 : Introduction to Software Systems Lecture 23 Alexandre Denault Computer Science McGill University Fall 2006 Course Evaluation - Mercury 22 / 53 41.5% Assignment 3 Artistic Bonus There
More informationFrontPage 2000 Tutorial -- Advanced
FrontPage 2000 Tutorial -- Advanced Shared Borders Shared Borders are parts of the web page that share content with the other pages in the web. They are located at the top, bottom, left side, or right
More informationModule 2 (VI): CSS [Part 3]
INTERNET & WEB APPLICATION DEVELOPMENT SWE 444 Fall Semester 2008-2009 (081) Module 2 (VI): CSS [Part 3] Dr. El-Sayed El-Alfy Computer Science Department King Fahd University of Petroleum and Minerals
More informationIslamic University of Gaza Faculty of Engineering Department of Computer Engineering ECOM Advanced Internet Technology Lab.
Islamic University of Gaza Faculty of Engineering Department of Computer Engineering ECOM 5049 Advanced Internet Technology Lab Lab # 1 Eng. Haneen El-masry February, 2015 Objective To be familiar with
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 informationWeb Design and Development ACS-1809
Web Design and Development ACS-1809 Chapter 4 Cascading Style Sheet Cascading Style Sheets A style defines the appearance of a document A style sheet - a file that describes the layout and appearance of
More informationIntermediate Web Publishing: Working with Styles
Intermediate Web Publishing: Working with Styles Jeff Pankin Information Services & Technology Contents Introduction... 2 In this class you will:... 2 Set the Preferences... 2 General... 2 Invisible Elements...
More informationWeb Programming and Design. MPT Junior Cycle Tutor: Tamara Demonstrators: Aaron, Marion, Hugh
Web Programming and Design MPT Junior Cycle Tutor: Tamara Demonstrators: Aaron, Marion, Hugh Plan for the next 5 weeks: Introduction to HTML tags, creating our template file Introduction to CSS and style
More informationPurpose of this doc. Most minimal. Start building your own portfolio page!
Purpose of this doc There are abundant online web editing tools, such as wordpress, squarespace, etc. This document is not meant to be a web editing tutorial. This simply just shows some minimal knowledge
More informationWeb Site Development with HTML/JavaScrip
Hands-On Web Site Development with HTML/JavaScrip Course Description This Hands-On Web programming course provides a thorough introduction to implementing a full-featured Web site on the Internet or corporate
More informationNEW WEBMASTER HTML & CSS FOR BEGINNERS COURSE SYNOPSIS
NEW WEBMASTER HTML & CSS FOR BEGINNERS COURSE SYNOPSIS LESSON 1 GETTING STARTED Before We Get Started; Pre requisites; The Notepad++ Text Editor; Download Chrome, Firefox, Opera, & Safari Browsers; The
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 informationUsing Dreamweaver CC. 6 Styles in Websites. Exercise 1 Linked Styles vs Embedded Styles
Using Dreamweaver CC 6 So far we have used CSS to arrange the elements on our web page. We have also used CSS for some limited formatting. In this section we will take full advantage of using CSS to format
More informationPrincess Nourah bint Abdulrahman University. Computer Sciences Department
Princess Nourah bint Abdulrahman University 1 And use http://www.w3schools.com/ JavaScript Objectives Introduction to JavaScript Objects Data Variables Operators Types Functions Events 4 Why Study JavaScript?
More informationINTRODUCTION TO WEB USING HTML What is HTML?
Geoinformation and Sectoral Statistics Section (GiSS) INTRODUCTION TO WEB USING HTML What is HTML? HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text Markup Language
More informationBASICS OF WEB DESIGN CHAPTER 2 HTML BASICS KEY CONCEPTS
BASICS OF WEB DESIGN CHAPTER 2 HTML BASICS KEY CONCEPTS 1 LEARNING OUTCOMES Describe the anatomy of a web page Format the body of a web page with block-level elements including headings, paragraphs, lists,
More informationE , Fall 2007 More with stylesheets
I hope that you ll appreciate my use of the waterfall both as a way to calm your frayed nerves and to provide you with a metaphor for the style sheets In this document, I d like to step back a little and
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 informationDHANALAKSHMI COLLEGE OF ENGINEERING, CHENNAI
DHANALAKSHMI COLLEGE OF ENGINEERING, CHENNAI Department of Computer Science and Engineering CS6501- INTERNET PROGRAMMING 2 & 16Mark Questions & Answers Year / Semester: III / V Regulation: 2013 Academic
More informationComm 244 Week 3. Navigation. Navigation. Websites need a formalized system of links to allow users to navigate the site
Comm 244 Week 3 Navigation Navigation Websites need a formalized system of links to allow users to navigate the site Navigation Many larger websites have multiple forms of navigation For example, look
More informationIntroduction to HTML
Introduction to HTML What is HTML? HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text Markup Language HTML describes the structure of Web pages using markup HTML elements
More informationCSS stands for Cascading Style Sheets Styles define how to display HTML elements
CSS stands for Cascading Style Sheets Styles define how to display HTML elements CSS has various levels and profiles. Each level of CSS builds upon the last, typically adding new features and typically
More informationDAY 4. Coding External Style Sheets
DAY 4 Coding External Style Sheets LESSON LEARNING TARGETS I can code and apply an embedded style sheet to a Web page. I can code and apply an external style sheet to multiple Web pages. I can code and
More informationWeb Technologies - by G. Sreenivasulu Handout - 1 UNIT - I
INTRODUCTION: UNIT - I HTML stands for Hyper Text Markup Language.HTML is a language for describing web pages.html is a language for describing web pages.html instructions divide the text of a document
More informationMPT Web Design. Week 1: Introduction to HTML and Web Design
MPT Web Design Week 1: Introduction to HTML and Web Design What will we do in this class? Learn the basics of HTML and how to create our own template Basic website structure Learn design concepts for a
More informationTitle: Jan 29 11:03 AM (1 of 23) Note that I have now added color and some alignment to the middle and to the right on this example.
Title: Jan 29 11:03 AM (1 of 23) Note that I have now added color and some alignment to the middle and to the right on this example. Sorry about these half rectangle shapes a Smartboard issue today. To
More informationCascading Style Sheets (CSS) Part 1 of 3: Introduction and overview
Cascading Style Sheets (CSS) Part 1 of 3: Introduction and overview Mike Hamilton V.P. Product Evangelism MadCap Software mhamilton@madcapsoftware.com Presenter Information Mike Hamilton MadCap V.P. of
More informationWhat is a web site? Web editors Introduction to HTML (Hyper Text Markup Language)
What is a web site? Web editors Introduction to HTML (Hyper Text Markup Language) What is a website? A website is a collection of web pages containing text and other information, such as images, sound
More informationIn the early days of the Web, designers just had the original 91 HTML tags to work with.
Web Design Lesson 4 Cascading Style Sheets In the early days of the Web, designers just had the original 91 HTML tags to work with. Using HTML, they could make headings, paragraphs, and basic text formatting,
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 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 informationPage Layout Using Tables
This section describes various options for page layout using tables. Page Layout Using Tables Introduction HTML was originally designed to layout basic office documents such as memos and business reports,
More informationCITS1231 Web Technologies. Introduction to Cascading Style Sheets
CITS1231 Web Technologies Introduction to Cascading Style Sheets The Problems with HTML Poor Coding No consistency in the way a document is developed. The same markup can often be written a number of ways.
More informationWeb Programming and Design. MPT Senior Cycle Tutor: Tamara Week 1
Web Programming and Design MPT Senior Cycle Tutor: Tamara Week 1 What will we cover? HTML - Website Structure and Layout CSS - Website Style JavaScript - Makes our Website Dynamic and Interactive Plan
More informationChapter 7 Typography, Style Sheets, and Color. Mrs. Johnson
Chapter 7 Typography, Style Sheets, and Color Mrs. Johnson Typography Typography refers to the arrangement, shape, size, style, and weight of text. Affects the navigation and usability of a web site and
More informationINTRODUCTION TO HTML5! CSS Styles!
INTRODUCTION TO HTML5! CSS Styles! Understanding Style Sheets HTML5 enables you to define many different types of content on a web page, including headings, paragraphs, lists, images, input fields, canvases,
More informationCOMS W3101: SCRIPTING LANGUAGES: JAVASCRIPT (FALL 2018)
COMS W3101: SCRIPTING LANGUAGES: JAVASCRIPT (FALL 2018) RAMANA ISUKAPALLI RAMANA@CS.COLUMBIA.EDU 1 LECTURE-1 Course overview See http://www.cs.columbia.edu/~ramana Overview of HTML Formatting, headings,
More information1. Cascading Style Sheet and JavaScript
1. Cascading Style Sheet and JavaScript Cascading Style Sheet or CSS allows you to specify styles for visual element of the website. Styles specify the appearance of particular page element on the screen.
More informationHTML, beyond the basics
HTML, beyond the basics HTML Classes and IDs Classes are attributes that attach information to an element so you can do more things with some or all elements that belong to a certain class. IDs, like classes,
More informationCREATING A WEBSITE USING CSS. Mrs. Procopio CTEC6 MYP1
CREATING A WEBSITE USING CSS Mrs. Procopio CTEC6 MYP1 HTML VS. CSS HTML Hypertext Markup Language CSS Cascading Style Sheet HTML VS. CSS HTML is used to define the structure and content of a webpage. CSS
More informationIntroduction to JavaScript
127 Lesson 14 Introduction to JavaScript Aim Objectives : To provide an introduction about JavaScript : To give an idea about, What is JavaScript? How to create a simple JavaScript? More about Java Script
More informationBuilding Your Website
Building Your Website HTML & CSS This guide is primarily aimed at people building their first web site and those who have tried in the past but struggled with some of the technical terms and processes.
More informationCSS: formatting webpages
CSS: formatting webpages Why CSS? separate content from formatting (style) style can be changed easily without rewriting webpages keep formatting consistent across website allows more advanced formatting
More informationCS 350 Internet Applications I Name: Exam II (CSS) October 29, 2013
CS 350 Internet Applications I Name: Exam II (CSS) October 29, 2013 Part I. (50%) Multiple Guess Choice. 1. What does CSS stand for? a. Creative Style Sheets b. Computer Style Sheets c. Cascading Style
More informationWeb Development and HTML. Shan-Hung Wu CS, NTHU
Web Development and HTML Shan-Hung Wu CS, NTHU Outline How does Internet Work? Web Development HTML Block vs. Inline elements Lists Links and Attributes Tables Forms 2 Outline How does Internet Work? Web
More informationCSS Selectors. Web Authoring and Design. Benjamin Kenwright
CSS Selectors Web Authoring and Design Benjamin Kenwright Outline Review What are CSS Selectors? Different types of Selectors and Syntax Examples of how to use Selectors Summary Review/Discussion CSS Selectors
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 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 informationINTRODUCTION TO CSS. Mohammad Jawad Kadhim
INTRODUCTION TO CSS Mohammad Jawad Kadhim WHAT IS CSS Like HTML, CSS is an interpreted language. When a web page request is processed by a web server, the server s response can include style sheets,
More informationE ECMAScript, 21 elements collection, HTML, 30 31, 31. Index 161
A element, 108 accessing objects within HTML, using JavaScript, 27 28, 28 activatediv()/deactivatediv(), 114 115, 115 ActiveXObject, AJAX and, 132, 140 adding information to page dynamically, 30, 30,
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 informationIt is possible to create webpages without knowing anything about the HTML source behind the page.
What is HTML? HTML is the standard markup language for creating Web pages. HTML is a fairly simple language made up of elements, which can be applied to pieces of text to give them different meaning in
More informationNavigation. Websites need a formalized system of links to allow users to navigate the site
Comm 244 Week 3 Navigation Navigation Websites need a formalized system of links to allow users to navigate the site Navigation Many larger websites have multiple forms of navigation For example, look
More informationUNIT -II. Language-History and Versions Introduction JavaScript in Perspective-
UNIT -II Style Sheets: CSS-Introduction to Cascading Style Sheets-Features- Core Syntax-Style Sheets and HTML Style Rle Cascading and Inheritance-Text Properties-Box Model Normal Flow Box Layout- Beyond
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 information