[3] - My own Tumblr page!

<!DOCTYPE html> <html> <head> <title>{Title}</title> <style> header { background: url(http://dash.ga.co/assets/gene-bg.png); } header a { text-decoration: none; color: #fff; } h1 { display: inline; position: absolute; top: 60px; font-size: 42px; color: #fff; } h2 { display: inline; color: #fff; position: absolute; top: 120px; font-size: 20px; } body { background: #eee; font-family: sans-serif; } .post { background: #fff; margin: 40px auto; padding: 20px; border-radius: 6px; width: 640px; } .avatar { margin: 60px 30px; border-radius: 100%; } .container { max-width: 640px; margin: 0 auto; } .like-reblog { list-style: none; border: 1px solid #ccc; } .like-reblog li { float: right; padding: 6px; height: 20px; } .page { background: #222; padding: 20px; } .page a { text-decoration: none; color: #eee; } .pagelist { margin: 0 auto; width: 640px; } .pagenav { position: center; padding: 40px; word-spacing: 1; </style> </head> <body> <header> <div class="container"> <img class="avatar" src="{PortraitURL-128}"> <h1><a href="{BlogURL}">{Title}</a></h1> {block:Description} <h2>{Description}</h2> {/block:Description} </div> </header> {block:HasPages} <div class="page"> {block:Pages} <div class="pagelist"> <a href="{URL}">{Label}</a> </div> {/block:Pages} </div> {/block:HasPages} {block:Posts} {block:Text} <div class="post"> {block:Title} <h3> <a href="{Permalink}">{Title}</a> </h3> {/block:Title} {Body} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Text} {block:Photo} <div class="post"> <img src="{PhotoURL-500}"> {block:Caption}{Caption}{/block:Caption} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Photo} {block:Quote} <div class="post"> {Quote} {block:Source}<br>—{Source}{/block:Source} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Quote} {block:Link} <div class="post"> <a href="{URL}" {Target}>{Name}</a> {block:Description}{Description}{/block:Description} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Link} {block:Chat} <div class="post"> {block:Title}{Title}{/block:Title} <table> {block:Lines} <tr> <th>{block:Label}{Label}{/block:Label}</th> <td>{Line}</td> </tr> {/block:Lines} </table> <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Chat} {block:Audio} <div class="post"> {AudioPlayer} {block:Caption}{Caption}{/block:Caption} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Audio} {block:Video} <div class="post"> {Video-500} {block:Caption}{Caption}{/block:Caption} <ul class="like-reblog"> <li>{LikeButton}</li> <li>{ReblogButton}</li> <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> </ul> </div> {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:Video} {/block:Posts} {block:Pagination} <div class="pagenav"> {block:PreviousPage}<a href="{PreviousPage}">Previous</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">Next</a>{/block:NextPage} </div> {/block:Pagination} </body> </html>
HTML and CSS

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.