Front End, HTML/CSS, IT, Uncategorized

CSS Class and ID Simple Exercise with Solution


Using external CSS style sheet, create the following design:

  • Main Div as a container for all the following elements. Use #EEE as a background color: It contains:
  • First Div:
  • Add an id for the div.
  • Use an rgba background color. Green value is 9, red is 3, blue is 33, and the alpha value is 0.9.
  • Insert your full name using heading one.
  • Center your name.
  • Use “Comic Sans MS” font.
  • Use 30 pixels font size.
  • Use ff5722 hex value as a color for the heading.
  • Second Div:

  • Add an id for the div.
  • Use a rgba background. Rgb is (0,0,0) and 0.1 alpha value.
  • Use a suitable tag to insert the following text: “I am an E-Buseinss student. It is a two-years E-Business programme. It is a combination of technological expertise and business skills development.”
  • Add a suitable class to the text.
  • Design the text as the following:
  • Color the text with #072942 hex value.
  • Align it to the left side.
  • Use Arial font type.
  • Use 14 pixels font size.
  • Insert 2 html buttons after the text. Write on it: “About EB”, and “About Me”.
  • Buttons design:
  • background color is #1A1F35.
  • Use white color hex value for the text color.
  • Use “Trebuchet MS” font type.
  • Use font size 15 pixels.
  • Use bold font.
  • Remove the button border.




2 thoughts on “CSS Class and ID Simple Exercise with Solution”

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s