CIS363A Lab 3 – Internal, tag and external css – screenshot attached – perfect solution

Lab Price = $10
Please feel free to send us your queries at: support@iqrajavaid.com
Payment methods

Add to Cart

Buy Now

View Cart


Problem Statement

iLab 3 of 6: Create a Web Page Using CSS in Dreamweaver
Note!
Submit your assignment to the Dropbox located on the silver tab at the top of this page.
(See the Syllabus section “Due Dates for Assignments & Exams” for due dates.)
iLAB OVERVIEW
Scenario and Summary
This iLab supports the following TCOs.
TCO 3—Given an original source document, convert the document to a web page using HTML and CSS.
TCO 4—Given an older website that requires updating, review the techniques used to create the current site, develop a plan to revise the site using CSS layout techniques, client-side scripts, and other current website design techniques, and convert the web pages based on the plan.
Scenario
Create an index.html file and create an external CSS file based on the specifications given in the assignment.
1. You will need to create an internal and external CSS.
2. You will also need to attach an external CSS file to the original page.
Deliverables
1. index.html with attached external CSS sheet
2. style.css file
Part Deliverable Points
A Create HTML and CSS files (style.css) 3
B Internal (embedded) CSS 22
C Tag Selector CSS 22
D Class CSS (index.html with attached external CSS sheet) 23
Total 70

Required Software
Dreamweaver
Access the software at https://devrydesktop.rkon.com.
Steps: All
iLAB STEPS
Lab Preparation
Download the lab3Content.docx document found in Doc Sharing.
Part A: Create HTML and CSS Files (3 Points)
Step 1: Create a New HTML File (1 point)
Back to Top
• Open Dreamweaver and create a new HTML page.
• Enter index.html as the web page name.
Step 2: Copy Content From the Word Document (1 point)
Back to Top
• Open the lab3Content document found in Doc Sharing.
• Paste the content into the index.html page.
Step 3: Create a CSS File (1 point)
Back to Top
• Create a new CSS page.
• Save the file and name it styles.css.
Note: If your styles.css file does not show when needed in the remaining steps, then click on the attach stylesheet icon, select browse, locate the styles.css file, and then click OK. (The styles.css will automatically be linked to the index.html file in the head section of the code.)
Part B: Internal CSS (22 Points)
Step 1: Create an Internal CSS (10 points)
Back to Top
• Go to the index.html file and create an internal CSS for the following properties. Use the Page Properties option in the Properties Panel.
Background color for the body A light tan: #FC6
Font color for all text in the body A dark blue: #039
Font for all text in the body Comic Sans MS
Font size for all the text in the body Body: 14 points
Link color for all links Dark red: #CC0000
Visited link color for all links Dark red: #CC0000
Rollover link color for all links Dark green: #060
Active link color for all links Dark red: #CC0000
No link should be underlined for all links Never underline

Step 2: Apply Internal CSS (12 points)
Back to Top
• Your index.html page should reflect the styles from above.
• Go back to Page Properties if the page did not update with your internal CSS.
Part C: Tag CSS (22 Points)
Step 1: Create Tag CSS (10 Points)
Back to Top
• For all of the following tags, create the CSS rule from the descriptions below.
• Hint: To create a CSS, you need to click on the New CSS Rule in the CSS panel on the right-hand side. Watch Adobe TV on best practices for creating a style sheet. You will need to enter Style Sheets or CSS in the Adobe TV searchbox (http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7e32a.html).


H2 Text color: #333, bold
H3 Background color: #39f
Border on the bottom with the following rules
• Width: thin
• Style: solid
• Color: #003
Centered text
Margin on all sides: 35 pixels
p Font: Georgia
Text color: #030
Padding of 15 pixels on all sides
li Font family: Arial
Background color: gray
Text color:black, bold
Text size: 18 points

Step 2: Apply Tag CSS (12 points)
Back to Top
• Apply the new tag CSS to the content on the page.
Part D: Class CSS (23 Points)
Step 1: Create a Class CSS (10 points)
Back to Top
• Create a new CSS rule using a class CSS. You will need to select the option to include the class CSS to the styles.css file.


Navtable: This class will be applied to a navigation table. Font family: Times Roman
Background color: #0ff
Text color: bold, center
example1: This class will be applied to Example 1. Background color: #699
Text color: #033, bold
Text size: 10 points
Margin on all sides: 25 pixels
Padding on all sides: 25 pixels
example2: This class will be applied to Example 2. Background color: #66c
Border on all sides with the following rules
• Width: 10px
• Style: solid
• Color: #06c
Text size: 10 pixels
Text color: #ccc
header: This class will be applied to the heading “IEBGENER STUDY GUIDE.” Font family: Arial
Background color: #6ff
Text color: 030
Text size: 36 points
Margin on all sides: 50 pixels
Padding on all sides: 50 pixels

Step 2: Apply the Class CSS (12 points)
Back to Top
• Apply the class CSS as done in the class CSS steps above.
Step 3: Upload Zipped File (1 point)
Back to Top
• Your index.html page should have all inline, tags, and class CSS applied.
o Create a folder called CIS363A_YourLastName_Lab3.
o Put copies of each required deliverable into the new folder.
o Right-click on the folder and select Send To -> Compressed (zipped) Folder. You can also use other tools to compress the files into a single zip folder (e.g., 7-zip).
o Upload the zip file to the weekly iLab Dropbox in eCollege.
Submit your lab to the Dropbox located on the silver tab at the top of this page. For instructions on how to use the Dropbox, read these step-by-step instructions or watch this Tutorial Dropbox Tutorial.
See the Syllabus section “Due Dates for Assignments & Exams” for due date information.

Relevant Material
Screenshots
screenshot_Lab3_Output
Lab3 – Output
Instructions
* If you want to purchase multiple products then click on “Buy Now” button which will give you ADD TO CART option.Please note that the payment is done through PayPal.
* You can also use 2CO option if you want to purchase through Credit Cards/Paypal but make sure you put the correct billing information otherwise you wont be able to receive any download link.
* Your paypal has to be pre-loaded in order to complete the purchase or otherwise please discuss it with us at support@iqrajavaid.com.
* As soon as the payment is received, download link of the solution will automatically be sent to the address used in selected payment method.
* Please check your junk mails as the download link email might go there and please be patient for the download link email. Sometimes, due to server congestion, you may receive download link with a delay.
* All the contents are compressed in one zip folder.
* In case if you get stuck at any point during the payment process, please immediately contact us at support@iqrajavaid.com and we will fix it with you.
* We try our best to reach back to you on immediate basis. However, please wait for atleast 8 hours for a response from our side. Afterall, we are humans.
* Comments/Feedbacks are truely welcomed and there might be some incentives for you for the next lab/quiz/assignment.
* In case of any query, please donot hesitate to contact us at support@iqrajavaid.com.
* MOST IMPORTANT Please use the tutorials as a guide and they need NOT to be used for any submission. Just take help from the material.
******************************************** Good Luck ***************************************************
Privacy Policy
We take your privacy seriously and will take all measures to protect your personal information.
Any personal information received will only be used to fill your order. We will not sell or redistribute your information to anyone.
Refund Policy
Incase you face any issues with the tutorial, please free to contact us on support@iqrajavaid.com
We will try our best to resolve the issue and if still persists we can discuss for a refund in case its required.
Payment Details
Lab Price = $10
Please feel free to send us your queries at: support@iqrajavaid.com

Payment methods

Add to Cart

Buy Now

View Cart

Leave a Reply