How to implement a table structure using CSS
<table>
<tr>
开发者_StackOverflow中文版<td></td>
<td></td>
</tr>
</table>
How do i replicate this kind of a structure using <div>
or <span>
'ed CSS
Depends on what you're trying to replicate.
With the simple example you've given, it's not easy to tell exactly what you're trying to achieve, but if what you're tring to do is put two blocks side by side (ie as columns in a page layout), you just need to create a couple of <div>
elements and style them using CSS to appear next to each other. Depending on exactly what you want, there are a number of ways you could do the stylesheets.
One option would be to set them both as float:left;
. Use width:...
to set how wide you want them in pixels or percent.
If float
is too complex for you (and it is quite a big jump in concept from a table-based layout), you may want to consider using display:inline-block;
instead. This will also allow the <div>
s to be positioned next to each other, but gives you more control over how they position themselves.
Finally, if the contents of the <table>
is actually a table of data, don't be afraid of keeping it in a table - the <table>
tag and its friends are still valid HTML, and putting tabular data into a table is still a good thing.
If you mean that you want to display two DIVs next to eachother, try using the css styles float:left or float:right. use another div with clear:left, clear:right or clear:both to reset following divs to normal behavior.
Here is a link explaining more about that:
http://www.w3schools.com/css/css_float.asp (click the 'try it' links for very good examples)
I don't know if that's what you're looking for... but I hope so!
精彩评论