CODEWITHSUNDEEP
htmlhtml5-canvascss-shapes
hello
hello

Reputation: 55

How to create a rectangle in HTML and put some text on it?

I want to create a rectangle in html and put some text on it. And when on clicking on that rectangle it should redirect to another page.. Any pointers?

Upvotes: 1

Views: 18803

Answers (1)

jbutler483
jbutler483

Reputation: 24549

You should use an a tag with a display setting:

a {
  display: inline-block;
  height: 50px; /*sets height of element*/
  background: cornflowerblue; /*sets the background of this element (here a solid colour)*/
  transition: all 0.6s; /*sets a transition (for hover effect)*/
  padding-left: 20px; /*sets 'padding'*/
  padding-right: 20px; /*sets 'padding'*/
  line-height: 50px; /*for this, it sets vertical alignment*/
}
a:hover {
  background: tomato; /*sets background colour*/
}
<a href="#">Some Text</a>

Within your href attribute, you should place the link to your next page:

<a href="/Home/NextPageDirectory">Link Text</a>

Upvotes: 6

Related Questions