Answered step by step
Verified Expert Solution
Question
1 Approved Answer
For this assignment, design a login page that contains the following part: Part 1: Create two HTML webpage login.html and user.html. For login.html, create a
For this assignment, design a login page that contains the following part: Part 1: Create two HTML webpage login.html and user.html. For login.html, create a form that should have 4 input elements - 1. This should have a type email for the user to enter email Id. Make it a require field with max length 30. 2. This should have a type text for the user to enter Username. Make it a require field with max length 30. 3. This should have a type password for the user to enter password. Make it a require field. 4. Submit button that will redirect to user.html page. Add a div class login-page for login page and a div class form for form. The form method should be set to POST, and the action should be a new html page user.html. Below is the picture for your reference. file:///Users/Desktop/login.html The HTML5 Email Username Password Login Part 2: Change the look of an entire webpage by adding an external style sheet. In login.html page, include a reference to the external style sheet file inside the element of the section. Select elements with a "login-page class (write a period (.) character, followed by the name of the class) to adjust width, padding, and margin. Select elements with a form class to adjust the position and background color of the form. Also, modify the maximum width, margin, padding, text alignment of the form. Use attribute selectors to style form input type (username and password), adjust font family, background, width, margin, padding, box size, font size. Use attribute selectors to style button input type, adjust font family, text transform, background, width, padding, color, font size, and cursor. Select elements with a label name to adjust labels position, color, width, font weight, display, margin, text alignment. Select elements with a body' name to set the body background color to grey. Below is the picture for your reference. mike@gmail.com Username Mike Password LOGIN Part 3: On clicking the LOGIN button, it will redirect the form to a new HTML page "user.html. The user.html page will have a paragraph with You are logged in.. text message. Below is the picture for your reference. file:///Users/Desktop/BUS%20118W/BUS%20118W%20Assignment%202/user.htmlPemailemik You are logged in
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started