Start menu -> all program -> Microsoft Visual SourceSafe-> Microsoft Visual Studio 2010 Click.

Slides:



Advertisements
Similar presentations
Introduction to Web Design Lecture number:. Todays Aim: Introduction to Web-designing and how its done. Modelling websites in HTML.
Advertisements

This Presentation Contains Narration and Notes To hear the narration, turn on your speakers or plug in headphones. If you would like to view this slideshow.
Chapter 3 – Web Design Tables & Page Layout
Creating & Editing Tables Keyboarding 1A. To Create a Table: From the Menu Bar, select Table select Insert select Table Type in the number of columns.
MS-Word XP Lesson 7.
Microsoft FrontPage Monday January 28, The Basic FrontPage Setup.
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.
Links.  Styling Links  Links can be styled with any CSS property (e.g. color, font-family, background-color).  Special for links are that they can.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
Principles of Web Design 5 th Edition Chapter Nine Site Navigation.
INTRODUCTORY Tutorial 7 Creating Liquid Layouts. XP Objectives Discern the differences among various types of layouts Create a liquid layout Create a.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
End User Computing An Introduction to CSS Sujana Jyothi Research Lab1, Callan Building, Department of Computer Science
Advance CSS (Menu and Layout) Miftahul Huda. CSS Navigation MENU It's truly remarkable what can be achieved through CSS, especially with navigation menus.
CSS BASICS. CSS Rules Components of a CSS Rule  Selector: Part of the rule that targets an element to be styled  Declaration: Two or more parts: a.
1 Dreamweaver CS5 intermediate class by Cookie Setton Build a CSS website WITHOUT TABLES Just when you thought you were starting to understand HTML coding,
Using Advanced Cascading Style Sheets
Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:
Diliev.com & pLOVEdiv.com  DIliev.com.
กระบวนวิชา 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.
Unit 20 - Client Side Customisation of Web Pages
Chapter 8 Creating Style Sheets.
CSS normally control the html elements. Three Ways to Insert CSS There are three ways of inserting a style sheet: External style sheet Internal style.
Web Design with Cascading Style Sheet Lan Vu. Overview Introduction to CSS Designing CSS Using Visual Studio to create CSS Using template for web design.
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 9 1 Microsoft Office FrontPage 2003 Tutorial 9 – Using Layout Tables, Styles, and Office.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
INSTRUCTIONAL SUPPORT SERVICES (ISS) SHORT COURSE, FALL 2012 UMSL Introduction to Web Page Design.
With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)
TUTORIAL 8: Enhancing a Web Site with Advanced CSS
2. Introduction to the Visual Studio.NET IDE 2. Introduction to the Visual Studio.NET IDE Ch2 – Deitel’s Book.
Using Dreamweaver getting started 1)Start in your “My Documents” folder 2)Create a new folder called “website” 3)Create a sub folder called “images” 4)Start.
Web Design HTML, Frontpage, DreamWeaver μέρος β ΠΡΥ019 - Πληροφορική Δρ.Βάσος Βασιλείου.
Tutorial 6 Creating Tables and CSS Layouts. Objectives Session 6.1 – Create a data table to display and organize data – Modify table properties and layout.
Dreamweaver CS4 Concepts and Techniques Chapter 5 Templates and Style Sheets.
Creating A Simple Web Page. Step 1- Open Dreamweaver & Create A New Page (File New) and blank.
HTML Concepts and Techniques Fourth Edition Project 8 Creating Style Sheets.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Web Technologies Website Development Trade & Industrial Education
CITY UNIVERSITY / Vysoká Škola Manažmentu.:IS Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 4 1. Create a folder on L/BSBA/IS330/website.
Web Design-Lecture2-QN-2003 Web Design Microsoft FrontPage®
Website Development with Dreamweaver
Project 5 Templates and Style Sheets Dreamweaver MX 2004 Concepts and Techniques.
Microsoft Word 2000 Presentation 5. Major Word Topics Columns Tables Lists.
Microsoft Expression Web-Illustrated Unit I: Working with Tables.
Language Club KompoZer Design View. Files you will need  Images  pages  Templates  Text.
Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.
Templates and Style Sheets
CSD 340 (Blum)1 Using Visual Studio CSD 340 (Blum)2 Start/Microsoft Visual Studio 2005/Microsoft Visual Studio 2005.
CHAPTER 5 Working with Data Tables and Inline Frames.
Web Design Part I. Click Menu Site to create a new site root.
1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.
1 Preparation for site Create a folder in MyDocuments: beavercheese. Create a subfolder, images Classes, career, DW beginner Download.
Building a Website: Layout Fall Overall Structure: Home Page Title Section Title Frame Picture UNCP Math Menu Content Footer Contact Information.
OV Copyright © 2008 Element K Content LLC. All rights reserved. Working with Web Pages  An Introduction to Cascading Style Sheets  Format a Web.
Web and Multimedia Development Copyright © Genetic Computer School 2007WM LESSON OVERVIEW  Use of Tables  Creating Tables  Try It – 1  Creating.
Creating Web Pages with Links, Images, and Embedded Style Sheets
Day 1: MS Excel for Beginners Aniko Balogh CEU Computer & Statistics Center
Microsoft Expression Web-Illustrated Unit G: Designing Site Navigation.
CSS.
Style Sheets.
Lab Styling Tabs with CSS Scott Lydiard
Project 8 Creating Style Sheets.
ASP.NET Web Controls.
How to Create Tables & Charts/Graphs in Excel
Chapter 2 – Introduction to the Visual Studio .NET IDE
Creating Tables in a Web Site
Intro to Web Development
Step 1:. Open Microsoft FrontPage application.
Programming with Microsoft Visual Basic 2008 Fourth Edition
Presentation transcript:

Start menu -> all program -> Microsoft Visual SourceSafe-> Microsoft Visual Studio 2010 Click

Open Microsoft Visual Studio 2010 window

Click New project

 Display new project window

 Click (Select ) Asp.Net Web Application  Add project name

 Click Browse button and select path  Ex: D:\new website

Display Default window

Click (left) solution Explorer

 Select unvented file (Ctrl+ mouse Click). Select then right click in mouse select Delete option

How to Create new page  Click (left) solution Explorer  Click Add - > New Item

Display Add New Item – Project window  Select Installed Templates-> Visual Basic -> web

 Select HTML.Page  Name Type index.htm  Click Add button

 Create index page

 Type title tag inside of the company name  Then type the meta tag coding

Create New folder in project  Click (left) solution Explorer  Click project name(left click in mouse) Add - > New folder

Create new folder  Type Style sheets create new folder

Create New Style sheets in project  Click (left) solution Explorer  Click project name(left click in mouse) Add - > New folder

 Select Style Sheet  Name Type Stylesheet.css  Click Add button Display Add New Item – Project window  Select Installed Templates-> Visual Basic -> web

Create New Style sheets in project  Click (left) solution Explorer  Click project name(left click in mouse) Add - > New Item

Display Add New Item – Project window  Select Installed Templates-> Visual Basic -> web  Select HTML.Page  Name Type Home.htm  Click Add button

 Create Home page

 Type title tag inside of the company name or project name  Then type the meta tag coding

 Then type the style ling tag coding

 Create one template in Photoshop

 Click style sheet then following css type body {margin: 0px;background-color:#510509;margin-left:auto;margin-right:auto;}

 Click home.htm then click the design view

 Click -> toolbox(lift) -> table (double click)

 Create table

 Select table and click F4 and type celpadding and celspacing Zero

 Click the source view and table width type 1000px and align="center"

 Click the design view and select the two columns then click right in muse the select Delete -> Delete columns  Delete and columns

 Select fist row and click F4 and type height type in top banner size  Ex: height :100px;

 Insert new row  Click (right) muse then select Insert-> Row Below or (ctrl+Alt+Down Arrow)

 Select second row and click F4 and type height type in image banner size  Ex: height :300px

 Click fist row then  Click -> toolbox(lift) -> table (double click)  Create inside of the row the click F4 and celpadding and celspacing type Zero

 Delete row (2) and columns(1)

 Click the fist columns and click F4 and height and width type ;  Ex: height :100px; widh: 40%

 Click second columns then  Click F4 and width :60% type then  Click -> toolbox(lift) -> table (double click)  Create inside of the row the click F4 and celpadding and celspacing type Zero  Delete 2 row and 2 columns the click F4 and high: 50px for fist row the click second row high:50px type

 Click second row then  Click -> toolbox(lift) -> table (double click)  Create inside of the row the click F4 and celpadding and celspacing type Zero  Delete 2 columns the click F4 and high: 50px for fist columns

 Insert new columns  Click (right) muse then select Insert-> Row Below or (ctrl+Alt+Right Arrow)  The select fist columns and click F4 width is 25% set width in columns (4 columns)

 Click styles sheet and type menu style Ex:.menu{font-family:Arial;font-size:14px;text-align:center;color:White;text-decoration:none; line-height:25px;}.menu:hover{font-family:Arial;font-size:14px;text-align:center;color:#fee490; text-decoration:none; line-height:25px;}

 Select fist menu columns  Click home.htm and click design view type following coding Ex: Home same coding for further menu ( select separate columns and type about us,profile, contact us)

 Click design view  Select home menu columns and click F4 type Align : center (all menu select and appall align:cente)