4. Code a style rule for the main element that puts padding around its contents. Then,
code a style rule for the footer that puts a blue border above it. Note that this border
doesn’t touch the border for the body.
5. Code style rules for the h1, h2, and h3 elements. The h1 font should be 150% of the
default specified in the body, the h2 font should be 125% of the default font, and the
h3 font should be 115% of the default font. The h1 font should also be blue. Then,
apply appropriate margins or padding to the h1, h2, and h3 elements so the spacing
before and after the headings is similar to what’s shown above.
6. Code the style rules for the <p>, blockquote, ul, and li elements so the spacing before
and after the elements is similar to what’s shown above.
7. Code a style rule for the cite element that changes its color to blue and removes the
italics from the text.
8. Code a style rule for the paragraphs that contain cite elements. This style rule should
right align the paragraphs and increase the spacing below to .75em. One way to do
this is to add a class attribute to these paragraphs and use that class as the selector for
the style rule.
9. Float the image to the left and apply appropriate margins or padding so the text flows
to its right as shown above.
10. Apply rules to the footer or the paragraphs within the footer so the font size is 90% of
the default, the font weight is bold, the paragraphs are centered, and the spacing
above and below is similar to what’s shown above.
I need help coding this css, the directions are above
Trending nowThis is a popular solution!
Step by stepSolved in 2 steps
- Please help me with this create a jframe with clickable image icons.m (text editor, trivia game, and word game. Then make a back for the jframe into a t squared fractal . Please also comment the codearrow_forwardBefore the paragraph, add an h2 header that reads "Introduction" and then an h3 header that reads "Section 2". Ensure each element has an opening and closing tag.arrow_forwardCreate a style rule for the #fig1 through #fig6 elements which are hovered, that rotates the elements to 0 degrees using the transform property, and applies a 2-second transition to all properties of those figures.arrow_forward
- Add a class attribute with the value mobile-tablet to the empty div element. Nest the following elements within this div element: An h3 element with the text Sponsorship Levels. Paragraph element with the text Green: $200. Paragraph element with the text Blue: $400. Paragraph element with the text Red: $600. Paragraph element with the text Purple: $800. Paragraph element with the text Silver: $1,000. Paragraph element with the text Gold: $1,500. Paragraph element with the text Each sponsorship supports our animals and operations. Business recognition is given at every sponsorship level. Contact us today to become a sponsor. <!DOCTYPE html> <!-- Student Name: File Name: partnership.html Today's Date: 07/07/2023 --> <html lang="en"> <head> <title><span class="icon">🐾</span>Wild Rescues: Template</title> <meta charset="utf-8"> <link rel="stylesheet" href="css/styles.css"> <meta…arrow_forwardIn the styles.css file, add the ul selector to the CSS reset style rule. Remove the declaration for the margin property in the nav ul style rule. Modify the nav li style rule by changing the display value to block and add a top border that specifies a solid border width of 0.5px with the color value #f6eee4. My CSS nav li { display: block; font-size: 1.5em; font-family: Geneva, Arial, sans-serif; font-weight: bold; border-top: solid border;arrow_forwardSwitch the ClientEntry form to Design view, and expand the Form Footer section to about 75" tall. Add a text box to the top right corner of the Footer section, and enter the formula =Count([ClientID]) as its control source. Enter Total Clients as the label name. (Hint: if necessary, change the width of the label so that the full text is visible). Add another text box directly below the one you just added, and enter the formula =SUM([MonthlyFee]) as the control source and Total Fees as its label name. Modify the Total Fees text box to use Currency format, then switch the ClientEntry form to Form view and confirm it matches Figure 3 below. Save the form. In the italic bold section that is the part I am having trouble with. For some reason the property sheet does not have the Currency Format in there at all. So, I am not sure if I did something wrong or what. Can you help. I am provind an image of the project. In the Total Fees text box is where I am stumped.arrow_forward
- Can you show me how to add a transition to top nav elements using Sublime Text Editor? Create style rules for a:hover and a:focus pseudo-elements that change the look of the nav bar. Choose background color, color, and font size. Create style rules for the a:active pseudo-elements. Choose the value of the margin-top, which should be 6px or more. Then, add a box shadow. Create the following transitions for for the <a> elements: change the background color, change the border-color, change the top, change the box-shadow, and set a reasonable duration for these changes(between .1 and .5s). You can optionally add transition-timing-function or a transition delay.arrow_forwardStay in the Heart of Sedona At Casita Sedona Bed & Breakfast you’ll be close to art galleries, shops, restaurants, hiking trails, and tours. Ride the free trolley to shops and galleries. Luxurious Rooms Stay in a well-appointed room at Casita Sedona with your own fireplace, king-size bed, and balcony overlooking the red rocks. Refer to the image with code to match the element with the correct description. 1. Stay in the heart of Sedona heading 2, second largest text on this webpage 2. Luxurious Rooms heading 3, third level of text size on this webpage 3. At Casita Sedona Bed & amp; Breakfast ... paragraph, smallest text displayed on this webpage 4. 5.arrow_forwardEvent Listeners Go to the co_cart.js file in your editor. Directly below the initial comment section, add an event listener for the window load event that does the following when the page is loaded: Runs the calcCart() function. Add an event handler to the modelQty field in the cart form that runs the calcCart() function when the field value is changed. A for loop that loops through every option in the group of shipping option buttons, adding an event handler to run the calcCart() function when each option button is clicked. JavaScript Functions Create the calcCart() function to calculate the cost of the customer’s order using field values in the cart form. Within the calcCart() function do the following: Create a variable named orderCost that is equal to the cost of the espresso machine stored in the modelCost field multiplied by the quantity of machines ordered as stored in the modelQty field. Display the value of the orderCost variable in the orderCost field, formatted as U.S.…arrow_forward
- Question 7 Calculate the total width: The picture above is 350px wide. The total width of this element is also 350px. The DIV element below the image has a width of 320px. After applying CSS styling, the DIV element becomes 350px wide (the same as the flower image above it) Using border, margin and padding, add to the DIV CsS styling that will make the DIV element 350px wide (You must use all three). div { width: 320px ..... } For the toolbar, press ALT+F10 (PC) or ALT+FN+F10 (Mac).arrow_forwardAdd an onclick event handler that calls the content() function to the button element in the main section.arrow_forward
- Database System ConceptsComputer ScienceISBN:9780078022159Author:Abraham Silberschatz Professor, Henry F. Korth, S. SudarshanPublisher:McGraw-Hill EducationStarting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSONDigital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
- C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSONDatabase Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage LearningProgrammable Logic ControllersComputer ScienceISBN:9780073373843Author:Frank D. PetruzellaPublisher:McGraw-Hill Education