Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
112 views

1 HTML Intro

This document contains information about the CSE326 Internet Programming Laboratory course. It includes 6 course outcomes focusing on skills with HTML, CSS, and JavaScript. It then outlines the 6 units of the course, which cover topics ranging from the basics of HTML to JavaScript DOM. It lists two textbooks and three references used in the course.
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
112 views

1 HTML Intro

This document contains information about the CSE326 Internet Programming Laboratory course. It includes 6 course outcomes focusing on skills with HTML, CSS, and JavaScript. It then outlines the 6 units of the course, which cover topics ranging from the basics of HTML to JavaScript DOM. It lists two textbooks and three references used in the course.
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 29

1

CSE326:
INTERNET PROGRAMMING
LABORATORY

2
Exam Category: X6

3
COURSE OUTCOMES
• CO1 :: Recognize the components, tools, sturucture and tags
of HTML, CSS and Javascript.

• CO2 :: Paraphrase the effect of various HTML, CSS tags,


properties and combination of them for web page design.

• CO3 :: Apply HTML, CSS and Javascript technologies


according to user requirements and observe the output of the
web page design

4
COURSE OUTCOMES
• CO4 :: Analyze output of web page after application of
different components of HTML, CSS and Javascript as per
required in the website development.

• CO5 :: Assess the effectiveness of selected components of


HTML, CSS and javascript with desired properties and values
for the concerned web based product.

• CO6 :: Construct a project with desired and verified selection


of advance components and features of HTML,CSS and
Javascript.

5
Unit I
• Exposure To HTML : HTML document structure,
Working with HTML basic elements like title, head,
body, Working with Root and Metadata, Script and
NonScript, Horizontal Rules and line breaks and
paragraph, working with citation, quotation, definitions
and comments, Types of Tags in HTML

6
Unit II
• Working with Text, Links, Images , URLS,
Multimedia and Interactive in HTML : Formatting
text with HTML physical style elements, Formatting
text with HTML logical style elements, Creating links
with anchor tag, Multimedia- audio,video tags and
attributes like controls, autoplay and loop, Working
with images in a web page

7
Unit III
• Cascading Style Sheets : CSS selectors like type, id,
class, Introduction To CSS and types of CSS, CSS
properties-text controlling and text formatting, CSS
Box Model- Padding, Margin, Border, Div and Span
Tag in CSS, Working with background Images

8
Unit IV
• Working with Tables : Working With Tables-Colspan and
Rowspan, applying css on tables, creating hoverable tables

• Working with Forms : Working with Forms- action


attribute, get and post methods, Form Elements and
Controls Like Text Inputs, TextArea, Buttons, CheckBoxes,
Dropdown Boxes, Radio Buttons, Select and File Select,
applying css on all controls of forms

• CSS Grids and Webpage Layouts : Grid introduction,


Grid container, Grid Item, Creating different layouts for
webpage
9
Unit V
• JavaScript Application Development : Incorporating
JavaScript in the HEAD and BODY element, Using an
External JavaScript file, Using variables and operators,
Using control statements such as if...else, switch, break and
continue, Using looping statements such as while,
do...while, for, Using Popup boxes such as Alert, Confirm,
and Prompt, Working with JavaScript Objects,Properties and
Methods

• JavaScript Functions, Events and Validation : Working


with Functions-Using function arguments and return
statement, Working with JavaScript Events like Form Based,
Keyboard Based and Mouse Based, JavaScript Form
Validation 10
Unit VI
• Javascript DOM : DOM introduction, DOM methods,
DOM document, DOM elements, DOM HTML, DOM
CSS, DOM Events

11
Text Books
• HTML 5 COVERS CSS3, JAVASCRIPT,
XML, XHTML, AJAX
– Author: KOGENT LEARNING
– Publisher Name: DREAMTECH PRESS

12
References
• WEB ENABLED COMMERCIAL APPLICATION
DEVELOPMENT USING HTML, DHTML,
JAVASCRIPT, DHTML AND PHP
– Author: IVAN BAYROSS
– Publisher Name: BPB PUBLICATIONS

13
References
• BEGINNING HTML, XHTML, CSS AND
JAVASCRIPT
– Author: JON DUCKETT
– Publisher Name: WILEY

14
Introduction to
HTML

15
Definitions

 W W W – World Wide Web.

 HTML – HyperText Markup Language – The


Language of Web Pages on the World Wide Web.

HTML is a text formatting language.

 URL – Uniform Resource Locator.

 Browser – A software program which is used to


show web pages. 16
Definitions
 “Normal text” surrounded by bracketed
tags that tell browsers how to display web
pages

 Pages end with “.htm” or “.html”

 HTML Editor – A word processor that has


been specialized to make the writing of
HTML documents more effortless.
17
Tags

 Codes enclosed in brackets


 Usually paired
<TITLE>My Web Page</TITLE>
 Not case sensitive
<TITLE> = <title> = <TITLE>

18
Choosing Text Editor
 There are many different programs that
you can use to create web documents.

 HTML Editors enable users to create


documents quickly and easily by pushing a
few buttons. Instead of entering all of the
HTML codes by hand.

 These programs will generate the HTML


Source Code for you. 19
Choosing Text Editor
 HTML Editors are excellent tools for
experienced web developers; however; it
is important that you learn and understand
the HTML language so that you can edit
code and fix “bugs” in your pages.

20
NotePad/ NotePad++
NotePad is the standard text editor that
comes with the microsoft windows
operating system.

 Click on the “Start” button located on


your Windows task bar.
 Click on “Programs” and then click on the
directory menu labeled “Accessories”.
 Locate the shortcut “NotePad” and click
the shortcut once. 21
Visual Studio Code

22
Visual Studio Code

23
Creating a Basic Starting
Document
<HTML>
<HEAD>
<TITLE>University</TITLE>
</HEAD>
<BODY>
This is what is displayed.
</BODY>
</HTML>
24
Creating a Basic Starting
Document
 The HEAD of your document point to above window
part.

 The TITLE of your document appears in the very top


line of the user’s browser.

 The text in your TITLE should be as descriptive as


possible because this is what many search engines,
on the internet, use for indexing your site.

25
Setting Document Properties

 Document properties are controlled by


attributes of the BODY element.

 For example, there are color settings for


the background color of the page, the
document’s text and different states of
links.

26
Why CSS?

27
CSS Definitions
❖Cascading Style Sheets (CSS) are a stylesheet language used to describe the
presentation of a document written in HTML or XML (including XML dialects like
SVG or XHTML).

❖CSS describes how elements should be displayed on screen, on paper, in


speech, or on other media. CSS is the only document styling language that
browsers understand.​

❖CSS has a standardized W3C specification.​


❖CSS1 is now obsolete,​
❖CSS2.1 is a recommendation,​
❖CSS3 is split into smaller modules, progressing on the standardization track.​

28
29

You might also like