Creating HTML files using Notepad

Size: px

Start display at page:

Download "Creating HTML files using Notepad"

Sharlene Butler
6 years ago
Views:

Reference Materials 3.1 Creating HTML files using Notepad Inside notepad, select the file menu, and then Save As. This will allow you to set the file name, as well as the type of file.

Most importantly though, you need to set the Save as type: to all files, otherwise it will add a.txt extension to whatever name you type.

1 Reference Materials 3.1 Creating HTML files using Notepad Inside notepad, select the file menu, and then Save As. This will allow you to set the file name, as well as the type of file. Next, select the location for the file. This could be on the desktop, or in a folder on your USB drive. At the bottom of the window you can set the file name. Most importantly though, you need to set the Save as type: to all files, otherwise it will add a.txt extension to whatever name you type. The final window should look like this: You can then specify your own extension for the file type. You can use.html for normal web pages,.php for program files, and.css for style sheets. Click the Save button when done, and your new file has been created. For this course, you should only use notepad, or notepad++ to edit text files. Editing your web pages in other programs (like Microsoft Word) will add a lot of additional junk to the file, and prevent me from grading them.

2 Reference Materials 3.2 Clearing Browser Cache s If your program doesn t seem to be updating correctly, you may need to clear your browsers Cache. To do this depends on your browser. Chrome: Go to settings, then advanced settings. Select Clear Browser data, then make sure Cached images and files is selected. Firefox:

3 Internet Explorer BIS1523 Reference Materials 3.3

4 Opera & Safari: BIS1523 Reference Materials 3.4

5 Reference Materials 3.5

6 Reference Materials 3.6 Lecture Outlines Lecture 1: Overview of Web Architecture and HTML Client/Server Architecture for the World Wide Web URL s HTML Files Tags Syntax <html> <head> <body> <title> Indentation and White Space in HTML files Attributes and Values Inheritance Semantic Tags <header> <footer> <nav> <article> <aside> <div> <section> Lecture 2: Lab Introduction, CSS Creating html, css, and php files using notepad The course user interface for uploading homeworks and in class work Tags <p> <h1 h6> <br> <em> <small> <strong> <sup> <sub> <pre> Links Absolute vs Relative URL s ID and Class attributes Linking to an ID CSS file syntax, linking to HTML file CSS property/value pairs Referencing by Element, ID, and Class Disabling Browser Cache CSS Attributes: Color, background, border Lecture 3: More CSS & Html, Positioning, Images Positioning and the Box Model Padding & Margin Height & Width Absolute and Relative Positioning Centering Things Formatting text: font family, style, weight, size, alignment Images JPEG, GIF, PNG <img>, width, height Lists, ordered and unordered, markers

7 Reference Materials 3.7 Lecture 4: PHP and Variables Programming: Input, Process, Output PHP Server Side Processing, File Names, Including in HTML Print Command Including HTML in output Escaping Quotes Viewing HTML source from your PHP program Variables Syntax and Naming Types: Numbers, Strings, Arrays Assignment Operator Printing variables Single vs Double Quotes Lecture 5: Forms and Input The 2-Page design for Input-Process-Output The <form> tag, action and method attributes Text input Submit button Retrieving user input values in PHP <select> tag Textarea Radio buttons Including CSS Magic Quotes Lecture 6: Numbers, Math, Strings Mathematical Operators Precedence and Parenthesis Incrementing, Decrementing Arithmetic Assignments Formatting Numbers Comments Multi-Line Print command Random Numbers Concatenation nl2br Lecture 7: In Class Programming Credit Card Payments

8 Reference Materials 3.8 Lecture 8: Conditions The if statement Boolean Variables Boolean functions: empty, isset, is_numeric The! operator Data Validation for input Flag Variables Relational Expressions String Comparisons The else clause Lecture 9 : More Selection Constructs Logical Operators Nested IF statements Elseif Switch Checkboxes Multiple PHP code sections Single-Page Program Design Lecture 10: For Loops and Tables For Loops Increment values Infinite Loops Generating Selection Blocks Iterative Calculations Tables in HTML: <table> <tr> <th> <td> Styling Tables with CSS: Borders, Colors, Collapse, nth-of-type() Lecture 11: In Class Programming: Supply and Demand Lecture 12: While Loops, Arrays While Loop Iterative Calculations Simulations Nesting Loops Post-Test Loops Creating Tables using Nested For Loops Arrays Creating Arrays: Numerically indexed and String Indexed Adding elements, Changing Elements Removing Elements Printing Elements Foreach loops

9 Reference Materials 3.9 Lecture 13: Arrays Populating from Checkboxes, Textareas Checkboxes to Arrays Variables as Keys Textarea to Array, Explode function, PHP_EOL Is_array() Implode() Hidden Fields Sorting Arrays: sort(), rsort(), asort(), arsort(), ksort(), krsort() Searching Arrays: simple, ranges, averaging Flag Variables and Not Found Lecture 14 Program Text Analyzer New functions: count, strlen, str_replace Lecture 15 Reading and Writing Files Paths, Directories, Naming.. and ~ Reading a File into an Array: file() Echoing a file Creating Checkboxes from a File Displaying a file into a table Multiple Files: Multi-Column table from a set of files Reading a File into a String: file_get_contents() Textarea Examples Writing file from Strings and Arrays: file_put_contents Text Editor Example Lecture 16 Program: Order System Lecture 17 Functions Inline vs Block elements Inline-Block display Formatting sections of text with <SPAN> and CSS Simple Functions (no parameters) Variable Scope and GLOBAL command Functions with Parameters Functions with Return Values Lecture 18 Web Applications Includes for organization, and to create frameworks Sessions: session_start(), $_SESSION, session_destroy() Example Program: Tracking Visits across web pages

10 Reference Materials 3.10 Lecture 19 In Class Program Today in History, CSV Files, Includes, Functions Lecture 20 Advanced CSS Making elements Float, Float vs Absolute Positioning Hover Text Decoration Styling Links Effects: Rounding Corners, Shadows, Backgrounds, Gradients Lecture 21 Advanced CSS Border Styles Transparent Colors Pop-Up Elements: Using display and hover in CSS Adjacent Sibling Selector Content:before, content: after Video: Native HTML5 viewing Video: Embedding Youtube Iframes Lecture 22 In Class Program: Video List Manually passing parameters using URL and $_GET CSS: Handling Overflow CSS: Min & Max Heights Lecture 23 In Class Program: Shopping Cart Cookies Lecture 24 In Class Program: Video List Editor Writing to files

11 Reference Materials 3.11 Lecture 1 HTML

12 Reference Materials 3.12 Lecture 2 HTML Lecture 2 CSS

13 Reference Materials 3.13 Lecture 2 Display

14 Reference Materials 3.14 Lecture 3 HTML

15 Reference Materials 3.15 Lecture 3 CSS

16 Reference Materials 3.16 Lecture 3 Display

17 Reference Materials 3.17 Lecture 5 HTML

18 Reference Materials 3.18 Lecture 5 PHP

19 Reference Materials 3.19 Lecture 6 - HTML

20 Reference Materials 3.20 Lecture 6: PHP

21 Reference Materials 3.21 Lecture 6 : Another way to output using multiple PHP sections

22 Reference Materials 3.22 Lecture 7 Credit Card Payment Calculator Input Screen: Output Screen:

23 Reference Materials 3.23 Lecture 7 HTML

24 Reference Materials 3.24 CSS: Lecture 7 PHP

25 Reference Materials 3.25

26 Lecture 8 PHP BIS1523 Reference Materials 3.26

27 Reference Materials 3.27 Lecture 9 Single Program Example This example takes the program from lecture 7, and combines the input & results into one page

28 Reference Materials 3.28.

29 Reference Materials 3.29 Lecture 11 PHP

30 Reference Materials 3.30 Lecture 14 PHP

31 Reference Materials 3.31

32 Reference Materials 3.32 Lecture 15 : List Contents Lecture 15: Checkboxes from File

33 Reference Materials 3.33 Lecture 15: Table from Multiple Files Lecture 15- Text Editor

34 Reference Materials 3.34 Lecture 16 Sales Page Input Screen:

35 Reference Materials 3.35 Lecture 16 Results Page

36 Reference Materials 3.36 Lecture 17 - Functions

37 Reference Materials 3.37 Lecture 18 Session Example

38 Reference Materials 3.38 Lecture 19 Today In History Todayinhistory.php

39 Reference Materials 3.39 Functions.php

40 Reference Materials 3.40 Lecture 22 - HTML Lecture 22 CSS

1/6/ :28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014

1/6/ :28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014 1/6/2019 12:28 AM Approved New Course (First Version) CS 50A Course Outline as of Fall 2014 CATALOG INFORMATION Dept and Nbr: CS 50A Title: WEB DEVELOPMENT 1 Full Title: Web Development 1 Last Reviewed: