Html+css web layout

•Télécharger en tant que PPTX, PDF•

2 j'aime•1,251 vues

Vijay Kumar Verma

Creating Web Layout using HTML and CSS

Technologie

Webdesignin
g
HTML+CSS

{ }

</>

Layout Creation
By:

Vijay Kumar Verma (VJY)
Roll No-1326910
28-Feb-2014

1

Purpose
Understand HTML+CSS
What is Class & ID
How to work with DIV
Layout From scratch
BY: VJY

2/28/2014

2

What is HTML & CSS
|

A Markup Language to Create Website.

|

CSS is used to describing the look and
formatting of webpages.

|

Pure HTML is just responsible to create simple
webpages

|

XHTML have strict rules for their syntax.

|

DHTML= HTML+CSS+DOM+JS

|

The DOM defines a standard for accessing
documents.

BY: VJY

2/28/2014

3

Now
Understand HTML+CSS
What is Class & ID
How to work with DIV
Layout From scratch
BY: VJY

2/28/2014

4

CSS Class & ID
Selector

Declaration

.myid

{ color: #fff; font-face:Arial; }
Property Value

|

Id selector: style for a single, unique element.

|

(#) dot is used for Id

|

Class selector: style for a group of elements.

|

(.) dot is used for class

BY: VJY

2/28/2014

5

Now
Understand HTML+CSS
What is Class & ID
How to work with DIV
Layout From scratch
BY: VJY

2/28/2014

6

DIV Tag
|

Defining a section of your document.

|

Group elements

|

Block Level Tag.

|

It create layers.

|

Faster Loading

|

Smaller file size

BY: VJY

2/28/2014

7

DIV Tag

(Cont..)

<body>
<div> <!—Wrapper-->

<div>First Block</div>
<div>Second Block</div>

</div>
</body>
BY: VJY

2/28/2014

8

Now
Understand HTML+CSS
What is Class & ID
How to work with DIV
Layout From scratch
BY: VJY

2/28/2014

9

Web Layout
|

Web layouts ensure that art is properly
oriented to match the design scheme
and specification of form and fill
equipment.

|

Types:
Fixed
b. Liquid
c. Elastic
a.

BY: VJY

2/28/2014

10

Requirements
|

A text editor (Notepad++)

|

An image editor (Photoshop)

|

Browser (Firefox)

|

Some passion and mind 

BY: VJY

2/28/2014

13

Have Any Question?
Just Ask!
Post Query On

facebook.com/groups/sviet.mca
Email@

vjy.softworx@gmail.com

Contenu connexe

Similaire à Html+css web layout

CSS Designer CertificationVskills

Html predestination - must everyone haveDailyReminder1

Punit summer traning report.pdfAliFaramarz

Learn html and css from scratchMohd Manzoor Ahmed

Fewd week2 slidesWilliam Myers

Dojo and Zend FrameworkKuldeep Singh

Introductory css and j queryFUTURE INSTITUTE MANAGEMENT AND ENGINEERING , SONARPUR

Html5 101Mouafa Ahmed

Css.htmlAnaghabalakrishnan

Cascading Style Sheets - Part 01Hatem Mahmoud

#4 - CSS Selectors, CSS3 and Web typographyiloveigloo

CSS101 - Concept Fundamentals for non UI DevelopersDarren Gideon

FFW Gabrovo PMG - CSSToni Kolev

Introduction to HTML and CSSMario Hernandez

CAD CertificationVskills

Style and SelectorYaowaluck Promdee

RenoirSt - A DSL enabling programmatic cascading style sheet generationGabriel Omar Cotelli

Completing Your Design with WordPressChelsea Otakan

div tag.pdfKongu Engineering College, Perundurai, Erode

wd project.pptxdsffsdf1

Similaire à Html+css web layout (20)

CSS Designer Certification

Html predestination - must everyone have

Punit summer traning report.pdf

Learn html and css from scratch

Fewd week2 slides

Dojo and Zend Framework

Introductory css and j query

Html5 101

Css.html

Cascading Style Sheets - Part 01

#4 - CSS Selectors, CSS3 and Web typography

CSS101 - Concept Fundamentals for non UI Developers

FFW Gabrovo PMG - CSS

Introduction to HTML and CSS

CAD Certification

Style and Selector

RenoirSt - A DSL enabling programmatic cascading style sheet generation

Completing Your Design with WordPress

div tag.pdf

wd project.pptx

Plus de Vijay Kumar Verma

Oo methodologyVijay Kumar Verma

XML XSLTVijay Kumar Verma

XML_schema_StructureVijay Kumar Verma

Introduction to Java ScriptVijay Kumar Verma

Php introduction and configurationVijay Kumar Verma

Security threats ecomVijay Kumar Verma

Dwm temporal measureVijay Kumar Verma

Html+css web layout 2Vijay Kumar Verma

Open gl configuration_march2014Vijay Kumar Verma

Aos distibutted systemVijay Kumar Verma

Plus de Vijay Kumar Verma (10)

Oo methodology

XML XSLT

XML_schema_Structure

Introduction to Java Script

Php introduction and configuration

Security threats ecom

Dwm temporal measure

Html+css web layout 2

Open gl configuration_march2014

Aos distibutted system

Dernier

Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j

IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge

My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar

Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106

Key Features Of Token Development (1).pptxLBM Solutions

[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745

From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software

The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad

Slack Application Development 101 Slidespraypatel2

08448380779 Call Girls In Civil Lines Women Seeking MenDelhi Call girls

AI as an Interface for Commercial BuildingsMemoori

Injustice - Developers Among Us (SciFiDevCon 2024)Allon Mureinik

GenCyber Cyber Security Day PresentationMichael W. Hawkins

04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG

Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAndikSusilo4

Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...HostedbyConfluent

Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada

Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski

Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC

Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes

Dernier (20)

Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...

IAC 2024 - IA Fast Track to Search Focused AI Solutions

My Hashitalk Indonesia April 2024 Presentation

Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics

Key Features Of Token Development (1).pptx

[2024]Digital Global Overview Report 2024 Meltwater.pdf

From Event to Action: Accelerate Your Decision Making with Real-Time Automation

The Codex of Business Writing Software for Real-World Solutions 2.pptx

Slack Application Development 101 Slides

08448380779 Call Girls In Civil Lines Women Seeking Men

AI as an Interface for Commercial Buildings

Injustice - Developers Among Us (SciFiDevCon 2024)

GenCyber Cyber Security Day Presentation

04-2024-HHUG-Sales-and-Marketing-Alignment.pptx

Azure Monitor & Application Insight to monitor Infrastructure & Application

Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...

Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024

Integration and Automation in Practice: CI/CD in Mule Integration and Automat...

Breaking the Kubernetes Kill Chain: Host Path Mount

Enhancing Worker Digital Experience: A Hands-on Workshop for Partners

Html+css web layout

1. Webdesignin g HTML+CSS { } </> Layout Creation By: Vijay Kumar Verma (VJY) Roll No-1326910 28-Feb-2014 1

2. Purpose Understand HTML+CSS What is Class & ID How to work with DIV Layout From scratch BY: VJY 2/28/2014 2

3. What is HTML & CSS | A Markup Language to Create Website. | CSS is used to describing the look and formatting of webpages. | Pure HTML is just responsible to create simple webpages | XHTML have strict rules for their syntax. | DHTML= HTML+CSS+DOM+JS | The DOM defines a standard for accessing documents. BY: VJY 2/28/2014 3

4. Now Understand HTML+CSS What is Class & ID How to work with DIV Layout From scratch BY: VJY 2/28/2014 4

5. CSS Class & ID Selector Declaration .myid { color: #fff; font-face:Arial; } Property Value | Id selector: style for a single, unique element. | (#) dot is used for Id | Class selector: style for a group of elements. | (.) dot is used for class BY: VJY 2/28/2014 5

6. Now Understand HTML+CSS What is Class & ID How to work with DIV Layout From scratch BY: VJY 2/28/2014 6

8. DIV Tag (Cont..) <body> <div> <!—Wrapper--> <div>First Block</div> <div>Second Block</div> </div> </body> BY: VJY 2/28/2014 8

9. Now Understand HTML+CSS What is Class & ID How to work with DIV Layout From scratch BY: VJY 2/28/2014 9

10. Web Layout | Web layouts ensure that art is properly oriented to match the design scheme and specification of form and fill equipment. | Types: Fixed b. Liquid c. Elastic a. BY: VJY 2/28/2014 10

11. Example BY: VJY 2/28/2014 11

12. How to create? BY: VJY 2/28/2014 12

13. Requirements | A text editor (Notepad++) | An image editor (Photoshop) | Browser (Firefox) | Some passion and mind  BY: VJY 2/28/2014 13

14. Have Any Question? Just Ask! Post Query On facebook.com/groups/sviet.mca Email@ vjy.softworx@gmail.com

15. Thank You!

Html+css web layout

Recommandé

Recommandé

Contenu connexe

Similaire à Html+css web layout

Similaire à Html+css web layout (20)

Plus de Vijay Kumar Verma

Plus de Vijay Kumar Verma (10)

Dernier

Dernier (20)

Html+css web layout