What is the difference between span, input, and div elements?
If you look at my code (here), I gave input
element to form1
and span
element in form2.span
. form2.span
is inline and input
is also an inline element, but why are they displ开发者_如何学JAVAaying in different ways? If not, what about the input
element?
What is the difference between span
, input
, and div
elements?
A few things:
- There isn't a DOCTYPE for this file (nor
<html>
tags for that matter), it's not doing much here, but could do some random things if is not because it puts some browsers into 'quirks' mode. - The reason your inputs are on the next line are because they don't fit on the line above. The is because the form width is set to 263px, the label width to 80px and the input width to 200px. 200 + 80px is bigger than 263px so it moves to the next line.
- The random bit of text the you have added in form 2 isn't actually in a
<span>
tag. - The reason that Email show up before the random text is because it's floated to the left, so it moves past the random text that isn't floated(This link is a good link for explaining that).
- The other reason that email has moved up a line is because it fits there, remember labels are 80px. 80+80 +(random text width) is less than 263px that the form width is set as.
As for the difference between divs and spans/inline elements. Look up "Inline vs Block Elements" in Google, or even here on StackOverflow, I'm sure it's been covered a few times.
精彩评论