HTML Tables, Lists, Blocks, Colors, Styles

Slides:



Advertisements
Similar presentations
Cascading Style Sheets Alternative to HTML tag style.
Advertisements

Tables Feb. 14, Tables Great way to organize and display information Laid out in columns and rows Think of an excel spreadsheet Defined with tag.
Farhan Nisar University of Peshawar
Table, List, Blocks, Inline Style
Intro to HTML. HTML HTML = HyperText Markup Language Used to define the content of a webpage HTML is made up of tags and attributes Content.
HTML and CSS. HTML Hyper Text Markup Language Tells browser how to display text and images.
HTML popo.
Introduction to HTML & CSS
HyperText Markup Language (HTML). Introduction to HTML Hyper Text Markup Language HTML Example The structure of an HTML document Agenda.
HTML: HyperText Markup Language Hello World Welcome to the world!
/k/k 1212 Cascading Style Sheets Part one Marko Boon
Making Things Look Nice: Visual Appearance and CSS CMPT 281.
Cascading Style Sheets. CSS stands for Cascading Style Sheets and is a simple styling language which allows attaching style to HTML elements. CSS is a.
Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:
กระบวนวิชา CSS. What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to.
Images, Tables, lists, blocks, layout, forms, iframes
HTML and Web Page Design Presented by Frank H. Osborne, Ph. D. © 2005 ID 2950 Technology and the Young Child.
Web Program Development1 February 23, 2011 HTML Web Page Development Debbie Bartlett February 23, 2011.
Basic HTML UCR Webmasters Support Group Derk Adams.
4.01 Cascading Style Sheets
HTML BASIC
Introduction to HTML academy.zariba.com 1. Lecture Content 1.What is HTML? 2.The HTML Tag 3.Most popular HTML tags 2.
Lesson 6. Links in HTML Computer Science Welcome to Virtual University in Pakistanhttp://
CS105 Introduction to Computer Concepts HTML
HTML basics exercises.
Creating a Web portal: Part II HyperText Markup Language (HTML) Bair-Mundy.
Learning HTML. HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Class – specifies a class.
ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.
HTML Overview Part 4 – Tables 1. HTML Tables  Tables are defined with the tag pair.  A table is divided into rows with tag pairs. o tr stands for "table.
 HTML stands for Hyper Text Mark-up Language. The coding language used to create documents for the World Wide Web  HTML is composed of tags. HTML tags.
Styling and theming Build campaigns in style. What we'll look at... How a web document is structured How HTML and CSS fit together Tools you will need.
1 CSC 121 Computers and Scientific Thinking David Reed Creighton University HTML and Web Pages.
1 eVenzia Technologies Learning HTML, XHTML & CSS Chapter 2.
1 HTML محمد احمدی نیا 2 Of 43 What is HTML?  HTML stands for Hyper Text Markup Language  HTML is not a programming language, it.
1.NET Web Forms HTML Introduction © 2002 by Jerry Post.
 This presentation introduces the following: › 3 types of CSS › CSS syntax › CSS comments › CSS and color › The box model.
Getting Started with HTML Please use speaker notes for additional information!
CSS Basic (cascading style sheets)
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
Cascade Style Sheet Introduction. What is CSS?  CSS stands for Cascading Style Sheets  Styles define how to display HTML elements  Styles were added.
Organization Components (Lists, Table & Frame) Wah Yan College (Hong Kong) Mr. Li. C.P.
Introduction to HTML Xiangming Mu 9/23/ Learning Objectives Understand basic HTML tags and their attributes Learn to create a simple HTML page.
HTML.
Course created by Sarah Phillips BBCD Melbourne BAPDCOM Version 1 – April 2013.
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
XHTML Formatting font with a style declaration. Formatting Font HTML uses the font tag to change size and family of font But… the font tag is being deprecated.
CSS Cascading Style Sheets A very brief introduction CSS, Cascading Style Sheets1.
Spiderman ©Marvel Comics Creating Web Pages (part 1)
WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
University of South Asia Course Name: Web Application Prepared By: Md Rezaul Huda Reza
Department of Computer Science, Florida State University CGS 3066: Web Programming and Design Spring
1 HTML. 2 Full forms WWW – world Wide Web HTTP – Hyper Text Transfer Protocol HTML – Hyper Text Markup Language.
Chapter 4 HTML Tags. HTML is written in something called tags. Tags come in pairs, an opening one and a closing one. The first pair of tags we'll write.
HTML Paragraphs Paragraphs are defined with the tag. Example This is a paragraph This is another paragraph.
Course created by Sarah Phillips BBCD Melbourne BAPDCOM Version 1 – April 2013.
1 R3 R1 R5 R4 R6 R2 B B A A Looking at the Code Under the View menu Select Source.
1 Mansoor Ahmed Bughio. 2 HTML TABLES With HTML you can create tables. Examples Tables This example demonstrates how to create tables in an HTML document.
HTML LAYOUTS. CONTENTS Layouts Example Layout Using Element Example Using Table Example Output Summary Exercise.
INTRODUCTION ABOUT DIV Most websites have put their content in multiple columns. Multiple columns are created by using or elements. The div element is.
HTML Basics (Part-3).
Web Basics: HTML/CSS/JavaScript What are they?
Web Development Part 1.
4.01 Cascading Style Sheets
Week 2: Introduction to Design and CSS
Elements of HTML Web Design – Sec 3-2
Web Development & Design Foundations with HTML5
Html.
4.01 Cascading Style Sheets
Web Programming and Design
Presentation transcript:

HTML Tables, Lists, Blocks, Colors, Styles

Tables are defined with the tag. A table is divided into rows (with the tag), and each row is divided into data cells (with the tag). td stands for "table data," and holds the content of a data cell. A tag can contain text, links, images, lists, forms, other tables, etc.

row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 row 1, cell 1row 1, cell 2 row 2, cell 1row 2, cell 2

row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 row 1, cell 1row 1, cell 2 row 2, cell 1row 2, cell 2

Border cellpadding cellspacing

The most common HTML lists are ordered and unordered lists: An ordered list: 1.The first list item 2.The second list item 3.The third list item An unordered list: List item

An unordered list starts with the tag. Each list item starts with the tag. Coffee Milk Coffee Milk

An ordered list starts with the tag. Each list item starts with the tag. The list items are marked with numbers. Coffee Milk 1.Coffee 2.Milk

HTML Color HTML colors are defined using a hexadecimal notation (HEX) for the combination of Red, Green, and Blue color values (RGB). HEX values are specified as 3 pairs of two-digit numbers, starting with a # sign. #00FFFF#

Hex color in photoshop

CSS (Cascading Style Sheets) is used to style HTML elements CSS is the another language to control html elements

style="background-color:yellow;“ style="background-color:# ffccf0;“ Example: This is a heading This is a paragraph. Style is written in open tag

A heading A paragraph. font-family:arial; color:red; or color: #ff0000; font-size:20px;

Center-aligned heading Move html element to center of the screen style="text-align:center;"> style="text-align:right;"> style="text-align:left;">

Defines a section in a document (block-level) Normally this tag will be use with Cascading style sheet (css)

Test Test

<div id="menu“ style="backgroundcolor:#FFD700; height:200px;width:100px; float:left;"> Test Test Instance name/nick name style

Main Title of Web Page Menu HTML CSS JavaScript Content goes here Copyright