Jump to content

happycodings

Members
  • Posts

    7
  • Joined

  • Last visited

Everything posted by happycodings

  1. Align the form controls with table<?xml version="1.0" ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head> <title>Align the form controls with table</title></head><body><h2>Reply to seller</h2><p>Use the following form to respond to seller:</p><form action="" method="post" name="frmRespond"><table> <tr> <td><label for="emailTo">To</label></td> <td><input type="text" name="txtTo" readonly="readonly" id="emailTo" size="25" value="Phone seller" /></td> </tr> <tr> <td><label for="emailFrom">To</label></td> <td><input type="text" name="txtFrom" id="emailFrom" size="25" /></td> </tr> <tr> <td><label for="emailSubject">Subject</label></td> <td><input type="text" name="txtSubject" id="emailSubject" size="60" /></td> </tr> <tr> <td><label for="emailBody">Body</label></td> <td><textarea name="txtBody" id="emailBody" cols="60" rows="12"> </textarea></td> </tr></table><input type="submit" value="Send email" /></form></body></html>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xml:lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Anchor background-image</title><style rel="stylesheet" type="text/css">#meta { display: block; float: right; padding: 20px 0 0 0;}#meta li { display: block; float: left; padding: 0 20px 0 0;}#meta a { display: block; float: left; font-family: Courier New; font-size: 12px; color: pink; text-decoration: none; padding: 0 0 0 13px; background-position: 0px 2px; background-repeat: no-repeat;}.meta1 { background-image: url(images/background-image1.gif)}.meta2 { background-image: url(images/background-image2.gif)}.meta3 { background-image: url(images/background-image3.gif)}</style></head><body> <div> <ul id="meta"> <li><a href="www.example.com" class="meta1">Home</a></li> <li><a href="Resources.html" class="meta2">Resources</a></li> <li><a href="Contacts.html" class="meta3">Contacts</a></li> </ul> <div id="search"> <input type="text" class="search" /> <input type="button" value="Search" class="search" /> </div> </div></body></html>
  3. Css table <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Css Table</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><style type="text/css">* { margin: 0; padding: 0}.container { background-color: #998FCC; width: 800px; border: 1px solid gray;}* html .container { width: 820px;}.header { width: 800px; border-bottom: 1px solid blue;}.header ul { list-style: none}.header ul li { width: 160px; border-left: 1px solid red; float: left; font-weight: bold; padding-left: 2px;}* html .header ul li { width: 180px;}.data { width: 180px; float: left; padding-left: 2px;}* html .data { width: 182px;}.rowodd,.roweven { position: relative; width: 800px; border-top: 1px solid #000; background-color: pink;}.roweven { background-color: #f79455;}.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}.clearfix { display: inline-block;}</style></head><body><div class="container clearfix"> <div class="header clearfix"> <ul> <li>Column 1</li> <li>Column 2</li> <li>Column 3</li> <li>Column 4</li> <li>Column 5</li> </ul></div> <div class="rowodd clearfix"> <div class="data"> <p>Company 1</p> <p>happycodings1</p> <p>happycodings2</p> <p>happycodings3</p> <p>happycodings4</p> </div> <div class="data"><p>paragraph</p></div> <div class="data"><p>paragraph</p></div> <div class="data"><p>paragraph</p></div> <div class="data"><p>paragraph</p></div> </div> <div class="roweven clearfix"> <div class="data"> <p>Company 1</p> <p>code example</p> <p>code example</p> <p>code example</p> <p>code example</p> </div> <div class="data"><p>java</p></div> <div class="data"><p>php</p></div> <div class="data"><p>android</p></div> <div class="data"><p>c++</p></div> </div> <div class="rowodd clearfix"> <div class="data"> <p>Company 1</p> <p>happy</p> <p>happy</p> <p>happy</p> <p>happy</p> </div> <div class="data"><p>codes</p></div> <div class="data"><p>codes</p></div> <div class="data"><p>codes</p></div> <div class="data"><p>codes</p></div> </div></div></body></html>
  4. Background attachment <html><head><title>Background Attachment</title></head><body><div style="background:blue url(http://www.lovelylovesayings.com/images/A-Red-Rose.jpg) repeat top left; width:1000; border:3; height:450; font-size:16"> To fall in love is to create a religion that has a fallible god.<br><br> Jorge Luis Borges </div> <br><br><br><br><div style="background-color:pink; background-attachment:fixed; background-image:url(http://www.lovelylovesayings.com/images/A-Red-Rose.jpg); background-repeat:repeat; background-position-x:top; background-position-y:left; width:1000; border:3; height:450; font-size:16"> background-attachment is fixed.<br><br> My love, you know you are my best friend.<br> You know that I'd do anything for you<br> And my love, let nothing come between us.<br> My love for you is strong and true.<br><br> Sarah McLachlan </div></body></html>
  5. <?xml version="1.0" ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head> <title>Unordered Lists</title></head><body><p>nested ordered list example:</p><ol type="I"> <li>apple</li> <li>pear</li> <li>pomegranate</li> <li> <ol type="a"> <li>watermelon</li> <li>banana</li> <li>cherry</li> </ol> </li> <li>mulberry</li></ol></body></html>
  6. Iframe style <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Iframe Style</title><style type="text/css" title="text/css">#iframewrapper { width: 400px; border: solid 8px pink;}#bordered { width: 400px; height: 400px;}iframe { width: 400px; height: 400px;}</style></head><body> <div id="iframewrapper"> <iframe src="http://www.example.com" scrolling="auto" name="news" frameborder="0" id="news"> Your browser doesn't support iframes. Please <a href="http://www.example.com">click here</a> </iframe> </div></body></html>
  7. Iframe application element <html><title>Iframe Application Element</title><body><iframe application="yes" src="happy.gif" style="width:50%;"></iframe><iframe application="no" src="happy.gif" style="width: 50%;"></iframe></body></html>
×
×
  • Create New...