Choose from our various pricing plans. There is a package for everyone!


Tutorial table CSS styled

View previous topic View next topic Go down

Tutorial Tutorial table CSS styled

Post by Mr.Joker on Sat Aug 25, 2012 2:02 pm

I designed one tutorial table which you can use for you forum.
Code:
Code:
[table style="width:100%; border-collapse:collapse;"]
[tr]
[td style="background-color:#ebecec;padding:10px;border-bottom:1px solid #cecece;border-top:1px solid #cecece ;border-left:5px solid #2896c9;border-right:5px solid #2896c9;text-align:center;color:#a2a8ab;font-size:20px;font-weight:bold;font-family:Tahoma;padding-bottom:5px;"]Tutorial Title[/td]
[/tr]
[tr]
[td style="background-color:#f9f9f9;border-bottom:1px solid #cecece;border-left:5px solid #2896c9;border-right:5px solid #2896c9; color:#a2a8ab;padding-left:5px;padding-right:5px;"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non ipsum eu est tincidunt ornare et id metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus varius fringilla tempor. Integer iaculis rhoncus nisl, egestas lacinia purus accumsan ultrices. Phasellus consectetur mauris at ligula lacinia vel mattis arcu bibendum. Mauris dapibus tempus enim, quis pretium lectus dapibus ut. Aliquam erat volutpat. Vestibulum in purus neque. Duis egestas diam fermentum lacus accumsan sed vulputate metus euismod. Curabitur pulvinar venenatis lobortis. Nullam bibendum, velit non pretium auctor, dolor massa molestie leo, non placerat leo leo ut eros.

Nulla facilisi. Etiam aliquet lacus quis enim pellentesque eget vehicula dui lacinia. Integer facilisis hendrerit nunc, vitae vestibulum urna ultrices et. Pellentesque nec molestie nisl. Quisque condimentum sollicitudin nisl ac adipiscing. Praesent at metus quis odio condimentum elementum id at quam. Morbi varius ultricies lacus, imperdiet sodales felis gravida a. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras dui arcu, hendrerit a pellentesque nec, interdum nec massa. Fusce eu quam vel sem molestie semper. Integer eget faucibus orci.

Cras volutpat, quam et blandit tempus, quam velit fermentum nisi, eget ultricies ante justo in odio. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi mattis mollis aliquam. Praesent eu sem sit amet mi aliquet pulvinar. Sed interdum nulla et sapien dictum varius. Phasellus vel eros eu mauris hendrerit tempus eget et mauris. Donec adipiscing varius enim, vitae scelerisque massa vehicula in. Nullam risus metus, adipiscing vitae lobortis ac, sagittis in ante. Morbi non arcu leo. Ut quis tristique neque. Donec turpis orci, mollis sit amet volutpat sit amet, commodo id dolor. Vivamus ac urna id risus mollis accumsan id quis augue. Nulla pellentesque, elit et vulputate ornare, dolor orci dignissim lectus, ut accumsan nisl diam auctor nibh.

In hac habitasse platea dictumst. Fusce mollis tempus malesuada. Phasellus condimentum dictum arcu, vel facilisis neque dapibus volutpat. Sed vel metus orci, vitae tincidunt risus. Integer sollicitudin arcu urna, non mattis dolor. Aenean bibendum magna at eros viverra blandit. Donec eleifend, augue vel accumsan adipiscing, elit ligula viverra eros, ac accumsan nunc urna vel dui. Fusce eget imperdiet massa. Pellentesque venenatis placerat felis faucibus egestas. Sed id ipsum tellus, sed hendrerit lacus. Maecenas blandit ante vel nunc consectetur et molestie velit ultrices. Nullam ac enim nisl. Cras mollis, eros at consectetur faucibus, odio justo tempor massa, id egestas libero quam at nibh. Ut vulputate quam in sapien fermentum sollicitudin. Phasellus id lorem non nibh mattis semper et sed augue.

Nulla ac nibh diam. Nam viverra pulvinar mi, semper pretium purus iaculis a. In viverra nisl ut sapien consequat ut sollicitudin urna tincidunt. Vestibulum id nibh ut libero elementum volutpat sit amet sit amet nunc. Mauris posuere nulla a nunc sollicitudin ultrices. Integer ipsum diam, pretium eget tincidunt a, aliquet ac nisi. Proin purus mauris, elementum rutrum fermentum et, egestas id urna. Nulla non diam dui. Vestibulum id diam vitae magna elementum auctor. Mauris interdum, justo et congue sagittis, libero justo consectetur augue, id lobortis orci nisl eu augue. Etiam feugiat leo non magna lacinia vel eleifend metus bibendum. In hac habitasse platea dictumst. Pellentesque est nulla, pharetra quis rutrum et, tempus eget mauris.[/td]
[/tr]
[tr]
[td style="background-color:#ebecec;border-bottom:1px solid #cecece;border-left:5px solid #2896c9;border-right:5px solid #2896c9; color:#a2a8ab;text-align:center;font-weight:bold;font-family:16px;"]Copyright Quick-Design[/td]
[/tr]
[/table]
DEMO:
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non ipsum eu est tincidunt ornare et id metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus varius fringilla tempor. Integer iaculis rhoncus nisl, egestas lacinia purus accumsan ultrices. Phasellus consectetur mauris at ligula lacinia vel mattis arcu bibendum. Mauris dapibus tempus enim, quis pretium lectus dapibus ut. Aliquam erat volutpat. Vestibulum in purus neque. Duis egestas diam fermentum lacus accumsan sed vulputate metus euismod. Curabitur pulvinar venenatis lobortis. Nullam bibendum, velit non pretium auctor, dolor massa molestie leo, non placerat leo leo ut eros.

Nulla facilisi. Etiam aliquet lacus quis enim pellentesque eget vehicula dui lacinia. Integer facilisis hendrerit nunc, vitae vestibulum urna ultrices et. Pellentesque nec molestie nisl. Quisque condimentum sollicitudin nisl ac adipiscing. Praesent at metus quis odio condimentum elementum id at quam. Morbi varius ultricies lacus, imperdiet sodales felis gravida a. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras dui arcu, hendrerit a pellentesque nec, interdum nec massa. Fusce eu quam vel sem molestie semper. Integer eget faucibus orci.

Cras volutpat, quam et blandit tempus, quam velit fermentum nisi, eget ultricies ante justo in odio. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi mattis mollis aliquam. Praesent eu sem sit amet mi aliquet pulvinar. Sed interdum nulla et sapien dictum varius. Phasellus vel eros eu mauris hendrerit tempus eget et mauris. Donec adipiscing varius enim, vitae scelerisque massa vehicula in. Nullam risus metus, adipiscing vitae lobortis ac, sagittis in ante. Morbi non arcu leo. Ut quis tristique neque. Donec turpis orci, mollis sit amet volutpat sit amet, commodo id dolor. Vivamus ac urna id risus mollis accumsan id quis augue. Nulla pellentesque, elit et vulputate ornare, dolor orci dignissim lectus, ut accumsan nisl diam auctor nibh.

In hac habitasse platea dictumst. Fusce mollis tempus malesuada. Phasellus condimentum dictum arcu, vel facilisis neque dapibus volutpat. Sed vel metus orci, vitae tincidunt risus. Integer sollicitudin arcu urna, non mattis dolor. Aenean bibendum magna at eros viverra blandit. Donec eleifend, augue vel accumsan adipiscing, elit ligula viverra eros, ac accumsan nunc urna vel dui. Fusce eget imperdiet massa. Pellentesque venenatis placerat felis faucibus egestas. Sed id ipsum tellus, sed hendrerit lacus. Maecenas blandit ante vel nunc consectetur et molestie velit ultrices. Nullam ac enim nisl. Cras mollis, eros at consectetur faucibus, odio justo tempor massa, id egestas libero quam at nibh. Ut vulputate quam in sapien fermentum sollicitudin. Phasellus id lorem non nibh mattis semper et sed augue.

Nulla ac nibh diam. Nam viverra pulvinar mi, semper pretium purus iaculis a. In viverra nisl ut sapien consequat ut sollicitudin urna tincidunt. Vestibulum id nibh ut libero elementum volutpat sit amet sit amet nunc. Mauris posuere nulla a nunc sollicitudin ultrices. Integer ipsum diam, pretium eget tincidunt a, aliquet ac nisi. Proin purus mauris, elementum rutrum fermentum et, egestas id urna. Nulla non diam dui. Vestibulum id diam vitae magna elementum auctor. Mauris interdum, justo et congue sagittis, libero justo consectetur augue, id lobortis orci nisl eu augue. Etiam feugiat leo non magna lacinia vel eleifend metus bibendum. In hac habitasse platea dictumst. Pellentesque est nulla, pharetra quis rutrum et, tempus eget mauris.
Copyright Mr.Joker
Author: Mr.Joker
Skills required: HTML & CSS
Difficulty: Easy


Please read forum rules. Don't request help via PM!

avatar
Mr.Joker
Premium Member


Age : 24
Posts : 283
Join date : 2012-06-24
Reputation : 21

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by whisper on Sat Aug 25, 2012 2:12 pm

Nice Smile
avatar
whisper
Member
Member

Age : 22
Posts : 11
Join date : 2012-08-15
Reputation : 0

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by AM99 on Sat Aug 25, 2012 2:52 pm

Nice keep it up
avatar
AM99
Member
Member

Age : 26
Posts : 152
Join date : 2012-07-27
Reputation : 2

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Th1nK on Sat Sep 29, 2012 9:31 am

Cool!
avatar
Th1nK
Administrator
Administrator

Posts : 468
Join date : 2012-04-06
Reputation : 43

View user profile http://www.csshelp.net

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Kilhen on Sat Sep 29, 2012 3:39 pm

Verry Cool !
avatar
Kilhen
Member
Member

Age : 23
Posts : 9
Join date : 2012-05-21
Forum Version : PhpBB3
Reputation : 0

View user profile http://dworld.forumz.ro/

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Leo on Sun Sep 30, 2012 10:38 pm

Great tutorial thanks!
avatar
Leo
Member
Member

Age : 19
Posts : 196
Join date : 2012-07-10
Reputation : 4

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Zilla on Mon Oct 01, 2012 2:52 pm

Tutorial accepted, thanks for submitting your tutorial.
avatar
Zilla
Premium Member


Age : 20
Posts : 166
Join date : 2012-05-03
Reputation : 13

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by refresh101 on Mon May 13, 2013 2:44 pm

How To Put Black Background On It?

Thanks Before party
avatar
refresh101
Member
Member

Age : 27
Posts : 18
Join date : 2013-05-03
Forum Version : PhpBB2
Reputation : 0

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Mr.Joker on Sun Jun 09, 2013 7:58 pm

@refresh101 wrote:How To Put Black Background On It?

Thanks Before party
Put black background where? Smile


Please read forum rules. Don't request help via PM!

avatar
Mr.Joker
Premium Member


Age : 24
Posts : 283
Join date : 2012-06-24
Reputation : 21

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Duke on Sat Jan 10, 2015 1:50 pm

good work
avatar
Duke
Member
Member

Age : 27
Posts : 7
Join date : 2015-01-10
Forum Version : PunBB
Reputation : 2

View user profile

Back to top Go down

Tutorial Re: Tutorial table CSS styled

Post by Sponsored content


Sponsored content


Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum