Scribd
Upload
68 views

Web Programming Indv Assignment PDF

1. The document discusses HTML tags, CSS, JavaScript programming, and objects. 2. It covers basic HTML tags like <html>, <head>, <title>, and <body> as well as how to add links, colors, images, tables, lists, and forms. 3. The CSS section explains how to use CSS to style text, backgrounds, fonts, links, boxes, borders, padding, and tables. It also covers classes, IDs, and display properties. 4. The JavaScript section discusses variables, operators, conditional statements, arrays, functions, events, and objects like Date and String. It explains how to add, run, and link JavaScript code.

Uploaded by

Sabona
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
68 views

Web Programming Indv Assignment PDF

1. The document discusses HTML tags, CSS, JavaScript programming, and objects. 2. It covers basic HTML tags like <html>, <head>, <title>, and <body> as well as how to add links, colors, images, tables, lists, and forms. 3. The CSS section explains how to use CSS to style text, backgrounds, fonts, links, boxes, borders, padding, and tables. It also covers classes, IDs, and display properties. 4. The JavaScript section discusses variables, operators, conditional statements, arrays, functions, events, and objects like Date and String. It explains how to add, run, and link JavaScript code.

Uploaded by

Sabona
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

DAMBI DOLLO UNIVERSITY

COLLEGE OF ENGINEERING AND TECHNOLOGY

DEPARTMENT OF COMPUTER SCIENCE

WEEK-END PROGRAM (THRID YEAR SECOND TERM)

Web Programming Individual Assignment

Name : Sabona Abera


ID No : NSW/315/19

SUBMISSION DATE 26Th -March-2023GC.

SUBMITTED TO : MR. MENDASA. T


Chaptert 1
HTML Tags
1. Basic HTML Tags
1.1 Hypertext Markup Language

 HTML, which stands for Hypertext Markup Language, is the predominant markup language used
for creating web pages.

1.2 HTML, HEAD, TITILE and BODY Tags

 The <html> tag is called the root element because it contains all the elements in the document,
and it can not be contained within any other element.

- Every web page starts with <html> tag and ends with </html>.

<HEAD> </HEAD>

- The web page should have only one head tag. The head tag starts with <head> and ends with
</head>.
The <BODY> Element
 This is where we will place our content for our visitors.

The <title> Element


 You should specify a title for every page that you write inside the <title> element.
This element is a child of the <head> element.
HTML Tag Attributes
Attributes provide additional information about HTML tags.
o <html> attribute
Setting HTML Language
 The HTML lang attribute can be used to declare the language of a Web page or a portion of a
Web page.
This is meant to assist search engines and browsers.
o <body> Attributes
Background Color
 You can change background color of your web page by using <BODY> tag attribute bgcolor
<body bgcolor=“green”>
o Background Image
We can use a background picture for web page instead of background color.
 Text Color

We can also set the text color of the web page just like background color. We use text attribute of
<BODY> to do this.
<body bgcolor=“yellow” text="red">
1.3 Creating Links

 A hyperlink (or link) is a word, group of words, or image that you can click on to jump to a new
document or a new section within the current document.

1.4 Working with Colors

 It can be used to change the background of your webpage, the color of your text or the content
of a table.

1.5 HTML Text Formatting Tags

HTML Headings

Headings are defined with the <h1> to <h6> tags. <h1> defines the largest heading and <h6> the
smallest heading.

1.6 Working with Graphics and Images

 It is often said that an single image is worth than thousands of words.

2. Tables and Lists


2.1 Creating Tables

 Tables are defined with the <table> tag.

2.2 Using Ordered and Unordered List

 An unordered list starts with the <ul> tag.

 An ordered list starts with the <ol> tag.


3. Frames
3.1 Working with Frames
 Frames can divide the screen into separate windows.
3.2 Working with iframes (internal frames)
 The <iframe> tag defines an inline frame that contains another document.
4. HTML Forms
 HTML forms are used to pass data to a server.
Password
 A password field works just like a text entry field, except the characters are obscured from view
using asterisk (*) or bullet (•) characters, or another character determined by the browser.
Text Area
1.9 Using Radio Buttons, Checkboxes and Selection Lists
1.10 Linking HTML Forms with PHP Scripts
1.11 Automating Processing: Info Forms and Emails
1.12 Inserting Multimedia
Unit 2
Cascading Style Sheet(css)
 A cascading style sheet file allows you to separate your web sites HTML content from its style.
The ID Selectors
 You can define style rules based on the id attribute of the elements.

Multiple Style Rules


 You may need to define multiple style rules for a single element.
You can define these rules to combine multiple properties and corresponding values into a
single block.
Grouping Selectors
 You can apply a style to many selectors if you like.
Just separate the selectors with a comma(,)
1.3 Linking CSS to HTML
 Embedded CSS(internal) - The <style> Element
 Inline CSS - The style Attribute
 External CSS - The <link> Element
 Imported CSS - @import Rule
Embedded CSS(internal) - The <style> Element
 This tag is placed inside the <head>...</head> tags.
 Rules defined using this syntax will be applied to all the elements available in the document.
Inline CSS - The style Attribute
 You can use style attribute of any HTML element to define style rules.
External CSS - The <link> Element
 The <link> element can be used to include an external stylesheet file in your HTML document.
An external style sheet is a separate text file with .css extension.
Imported CSS - @import Rule
 @import is used to import an external stylesheet in a manner
similar to the <link> element.
2. CSS Styling
2.1 Styling Backgrounds
You can style the background of an element in one declaration with the background property.
2.2 Styling Text
• Color
• Letter Spacing
• Word Spacing
• Line height
• Text Align
• Text Decoration
• Text Transform
2.3 Styling Fonts
The font property can set the style, weight, variant, size, line height and font:
2.4 Styling Links
 List Style
You can control the appearance of ordered and unordered lists in one declaration with the list-
style property:
list-style: image position type;
• List Style Image
• List Style Position
• List Style Type
3. CSS Box Model
3.1 The Box Model
The CSS box model is essentially a box that wraps around HTML elements, and it consists of:
margins, borders, padding, and the actual content.
• Margin - Clears an area around the border.
• Border - A border that lies around the padding and content
• Padding - Clears an area around the content.
• Content - The content of the box, where text and images appear
3.2 CSS Border
Border
You can set the color, style and width of the borders around an element in one declaration by
using the border property.
3.4 CSS Padding
 The padding clears an area around the content (inside the border) of an element.
3.5 Styling Tables
• Table Borders : To specify table borders in CSS, use the shorthand border property.
border: border-width border-style border-color;
4. Classes and Visibility
4.1 CSS Class and ID
4.1 CSS Class
 let’s say you want to change the word "sentence" in the paragraph formatted by the above CSS
to green bold text, while leaving the rest of the sentence untouched.
4.2 CSS ID
 IDs are similar to classes, except once a specific ID has been declared it cannot be used again
within the same HTML file.
4.2 CSS Display and Visibility
The display property specifies if/how an element is displayed
Chapter 3
JavaScript programming
•
1.1 Introduction
 JavaScript is a cross-platform, object-oriented scripting language modeled after C++.
1.2 Running the JavaScript
 Any time you include JavaScript in an HTML document, you must enclose the code inside a
<SCRIPT>...</SCRIPT> tag pair.
Adding JavaScript
 There are three ways to add JavaScript commands to your HTML pages.
• Embedding code
• Inline code
• External file
External File
 If you want to run the same JavaScript on several pages, without having to write the same script
on every page, you can write a JavaScript in an external file.
• 1.3 Working with Variables and Data
Declaring Variables
 To declare variable, we use the var keyword, followed by the name we want to give to the
variable.
• 1.4 Operators and Expressions
 Arithmetic Operators
 Assignment Operators
 Comparison Operators
 Logical Operators
Bitwise Operators
• 1.5 Working with Conditional Statements
 Broadly, there are two ways to execute code conditionally in JavaScript:
· If statement
· switch statement
 2.2 Using Arrays
An array is an ordered collection of data.
• 2.3 JavaScript Functions
Functions are one of the fundamental building blocks in JavaScript
• 3. JavaScript Objects and Events
3.1 Managing Events
 Events are occurrences generated by the browser, such as loading a document, or by the user,
such as moving the mouse.
• Registering Events
 In JavaScript, events can be registered to HTML elements in three different ways:
· registering using the HTML element attribute
· registering using property assignment
· registering using registerEventListener() method
• 3.2 Working with JavaScript Objects
 JavaScript has many built-in objects that you can use to perform different activities.
4 Object Properties and Methods
 All objects have properties and methods that are associated with them.
• 4.1 Date Object
 Most of your date and time work is done with the Date object.
4.1.1 String Object
 A string is any text inside a quote pair
var myString = “Hello there.”;
var stringVar = new String(“characters”)
• 4.1.2 Form Object
 The form object in JavaScript represents the HTML form in the page.
• 4.2 Form Processing and Validation
4.2.1 Accessing Form and Form Elements
 It is possible to access form and form elements from JavaScript.
You can set attributes for NAME,TARGET, ACTION, METHOD, and ENCTYPE for form.
• Selection Lists
 List boxes let you pick the item you want out of a multiple-choice box.
Use the selectedIndex property to test which option item is selected in the list.

You might also like