Answered step by step
Verified Expert Solution
Question
1 Approved Answer
How would I go about creating this following picture into HTML and CSS? Problem: You want to create a Web page and an external style
How would I go about creating this following picture into HTML and CSS? Problem: You want to create a Web page and an external style sheet that lists your piano practice and volunteer schedule, similar to the one shown in the piano practice picture. The Web page will use a table with images that span several rows and columns to organize the information. 1. Start a new HTML file with the title Lab 4-3 in the main heading section. 2. In the web page, create a bordered table that displays in 90% of the browser as shown in the piano practice picture. 3. Insert an inline style into the tag that assigns the border a color of #194a70, a border width of 20 pixels, and a border style of groove. Give the table a rounded-edge look by using the border-radius property. The radius should be 25 pixels. 4. Include the headings and data cells as shown, with valid information (i.e., real days and times as per a normal schedule of activities) in the data cells. The main headings (Piano Practice Schedule and Kid Camp Schedule) should be center-aligned across three columns and have a line height of 30 pixels. The data, other than the main headings, will have an indent of 10 pixels when the style sheet is coded and attached 5. Add two images, piano.png and kids.png, with all appropriate image attributes, each spanning five rows 6. The external style sheet should contain the following styles and be saved as lab4-3styles.css: body (font-family: Arial, Verdana, Garamond; font-size: 11pt: th.subtitle ftext-align: left, text-indent: 10px) td (text-ident 10px) (Ctrl) How would I go about creating this following picture into HTML and CSS? Problem: You want to create a Web page and an external style sheet that lists your piano practice and volunteer schedule, similar to the one shown in the piano practice picture. The Web page will use a table with images that span several rows and columns to organize the information. 1. Start a new HTML file with the title Lab 4-3 in the main heading section. 2. In the web page, create a bordered table that displays in 90% of the browser as shown in the piano practice picture. 3. Insert an inline style into the tag that assigns the border a color of #194a70, a border width of 20 pixels, and a border style of groove. Give the table a rounded-edge look by using the border-radius property. The radius should be 25 pixels. 4. Include the headings and data cells as shown, with valid information (i.e., real days and times as per a normal schedule of activities) in the data cells. The main headings (Piano Practice Schedule and Kid Camp Schedule) should be center-aligned across three columns and have a line height of 30 pixels. The data, other than the main headings, will have an indent of 10 pixels when the style sheet is coded and attached 5. Add two images, piano.png and kids.png, with all appropriate image attributes, each spanning five rows 6. The external style sheet should contain the following styles and be saved as lab4-3styles.css: body (font-family: Arial, Verdana, Garamond; font-size: 11pt: th.subtitle ftext-align: left, text-indent: 10px) td (text-ident 10px) (Ctrl)
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