跑馬灯

跑馬燈的頭條新聞文字內容放在這裡即可。

SlideWidget

Views

test table

欄位 1 欄位2 欄位3欄位4
欄位 1 欄位2 欄位3欄位4
欄位 1 欄位2 欄位3欄位4
欄位 1 欄位2 欄位3欄位4
欄位 1 欄位2 欄位3欄位4



Account Due Date Amount Period
Visa - 3412 04/01/2016 $1,190 03/01/2016 - 03/31/2016
Visa - 6076 03/01/2016 $2,443 02/01/2016 - 02/29/2016
Corporate AMEX 03/01/2016 $1,181 02/01/2016 - 02/29/2016
Visa - 3412 02/01/2016 $842 01/01/2016 - 01/31/2016
/* Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically. */ @media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) { /* Force table to not be like tables anymore */ table, thead, tbody, th, td, tr { display: block; } /* Hide table headers (but not display: none;, for accessibility) */ thead tr { position: absolute; top: -9999px; left: -9999px; } tr { margin: 0 0 1rem 0; } tr:nth-child(odd) { background: #ccc; } td { /* Behave like a "row" */ border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; } td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ top: 0; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } /* Label the data You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow. */ td:nth-of-type(1):before { content: "First Name"; } td:nth-of-type(2):before { content: "Last Name"; } td:nth-of-type(3):before { content: "Job Title"; } td:nth-of-type(4):before { content: "Favorite Color"; } td:nth-of-type(5):before { content: "Wars of Trek?"; } td:nth-of-type(6):before { content: "Secret Alias"; } td:nth-of-type(7):before { content: "Date of Birth"; } td:nth-of-type(8):before { content: "Dream Vacation City"; } td:nth-of-type(9):before { content: "GPA"; } td:nth-of-type(10):before { content: "Arbitrary Data"; } }
First Name Last Name Job Title Favorite Color Wars or Trek? Secret Alias Date of Birth Dream Vacation City GPA Arbitrary Data
James Matman Chief Sandwich Eater Lettuce Green Trek Digby Green January 13, 1979 Gotham City 3.1 RBX-12
The Tick Crimefighter Sorta Blue Wars John Smith July 19, 1968 Athens N/A Edlund, Ben (July 1996).
Jokey Smurf Giving Exploding Presents Smurflow Smurf Smurflane Smurfmutt Smurfuary Smurfteenth, 1945 New Smurf City 4.Smurf One
Cindy Beyler Sales Representative Red Wars Lori Quivey July 5, 1956 Paris 3.4 3451
Captain Cool Tree Crusher Blue Wars Steve 42nd December 13, 1982 Las Vegas 1.9 Under the couch

1 則留言: