pointspace : Design 6 « Templates « HTML / CSS






pointspace

   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="autor" content="Breezy New Media (info@breezy.cz)" />
<meta name="copyright" content="PointSpace - free website layout 2008" />
<meta name="description" content=""  />
<meta name="keywords" content="" />
<title>PointSpace - free luxury website layout</title>
<style type='text/css'>
/** 
 * Copyright 2008 Breezy New Interactive
 * =
 */ 

/* -- Basics -- */
html, body, div, p, form, fieldset, h1, h2, h3, h4, h5, h6   { margin: 0; padding: 0; }

body    { font: normal 10pt Arial, Helvetica, sans-serif; background: #fff; color: #000; }
a        { color: #153F7B; }
a:hover  { text-decoration: underline !important; color: #DB2032 !important;}
a:hover { color: #DB2032; }
a img   { border:0; }

h1  { font-size: 1.8em; margin-bottom: .5em; }
h2  { font-size: 1.45em; }
h3  { font-size: 1.4em; }
h4  { font-size: 1.2em; }
h5  { font-size: 1.1em; }
h6  { font-size: 1em; }

fieldset { border: 0 !important; }

/* -- Tables and lists -- */
table     { border-collapse: collapse; width: 100%; }
table th,
table td  { border: 1px black solid; padding: 5px; }

ul li { padding-left: 10px; }
ol li { padding-left: 10px; }

/* -- Basic layout -- */
#view    { }
#head    { font-size: 1.1em; position: relative; z-index: 1; display: none; }
#content { font-size: 1.1em; position: relative; z-index: 1; }
#foot    { font-size: 1.1em; position: relative; z-index: 1; display: none; }

/* -- Main classes -- */
.fr        { float: right !important; }
.fl        { float: left !important; }
.clear    { clear: both !important; }
.right    { text-align: right !important; }
.left      { text-align: left !important; }
.center    { text-align: center !important; }
.last      { margin-right: 0 !important; margin-bottom: 0 !important; border-bottom: none !important; }
.small    { font-size: .90em; }
.big      { font-size: 1.5em; }
.item     { margin-bottom: 1.5em; border-bottom: 1px #d8d8d8 solid; clear: both; }
.info     { font-size: .95em; margin: 2px 0 6px !important; }
.col1     { width: 49%; float: left; }
.col2     { width: 49%; float: right; }
img.left  { margin-left: 0 !important; }
img.right { margin-right: 0 !important; }

/* -- NoPrint items -- */
.hidden,
#menuBlock { display: none; }

/* -- Content items -- */
#contentBlock p,
#contentBlock ul,
#contentBlock ol,
#contentBlock table { margin-bottom: 2em; }


</style>


<link rel="stylesheet" type="text/css" href="./css/print.css" media="print" />
</head>
<body>

<div id="view">
  <!-- 
    #hlavicka vcetne loga a listy s hlavni nabidkou
      - h1 hlavn nadpis a absolutni pozadi v logu
      - ul seznam - hlavn menu (span odpovida cervene odrazce)
      - aktivni zalozka oznacena v elementu li tridou "active"
  -->
  <div id="head">
    <div id="logo">
      <a href="" class="block">&nbsp;</a>
      <h1><a href="index.html">point<span>space</span></a></h1>
      <h2><a href="index.html">luxury free website layout</a></h2>
    </div>
    <hr class="hidden" />
    <div id="mainMenu">
      <ul>
        <li><a href="index.html">Link 01<span></span></a></li>
        <li><a href="#content">Link 02<span></span></a></li>
        <li><a href="index.html">Link 03<span></span></a></li>
        <li class="active"><a href="">Link 04<span></span></a></li>
        <li><a href="index.html">Link 05<span></span></a></li>
        <li><a href="index.html">Link 06<span></span></a></li>
      </ul>
      
      <form action="" method="post" id="search">
        <fieldset>
          <input type="text" name="" value="" class="button" />
          <input type="submit" value="" class="submit" />
        </fieldset>
      </form>
    </div>
    <hr class="hidden" />
  </div>
  <!-- /#hlavicka vcetne loga a listy s hlavni nabidkou -->
  
  <div id="content">
    <!-- 
      #obsahovy blok
        - kazdy element je mozne odlisne formatovat pomoci predpripravenych trid (viz vysvetlivky v css souboru)
        - nadpisy hlavnich clanku jsou vyjadreny elementem h2, mensi clanky el. h3
        - kazdy clanek ulozen ve vlastni "div konstrukci" s tridou "item"
          - vsechny "item clanky" jsou oddeleny vodorovnou carou - zruseni mozne pomoci tridy last (viz prvni clanek sablony)
          - kazdy clanek obsahuje element p s tridou info, ktera popisuje dulezite informace ohledne vydani prislusneho clanku
          - v obsahu clanku (i mimo "item div konstrukci") je mozne dale vytvorit:
              - seznamy (ul, ol)
              - tabulky (table)
              - obrazky (img)
    -->
    <div id="contentBlock">
      <div class="item last">
        <h2>Main Heading</h2>
        <p class="info ico ico-date">02.02.2008 - <a href="index.html">article tag</a> - <a href="index.html">14 comments</a></p>
        <p>A spatial point is a concept used to define an exact location in space. It has no volume, area or length, making it a zero dimensional object. Points are used in the basic language of geometry, physics, vector graphics (both 2D and 3D), and many other fields. In mathematics generally, particularly in topology, any form of space is considered as made up of an infinite amount of points as basic elements.</p>
        <ul>
          <li>checkpoint</li>
          <li>checkpoint</li>
          <li>checkpoint</li>
        </ul>
        <table>
          <tr class="add">
            <td>table data</td>
            <td>table data</td>
            <td>table data</td>
          </tr>
          <tr class="even">
            <td>table data</td>
            <td>table data</td>
            <td>table data</td>
          </tr>
          <tr class="add">
            <td>table data</td>
            <td>table data</td>
            <td>table data</td>
          </tr>
        </table>
      </div>
      <!-- 
        #cols 50:50
           Kazdou dalsi podcast je mozne rozdelit pomoci dvojice konstrukci s tridami "col1" a "col2", ktere zpusobi -
           rozdeleni obsahu v pomeru 50:50 (uzito v pripade obrazku v sablone nize)
      -->
      <div class="col1">
        <div class="item">
          <h3>Article Heading</h3>
          <p class="info">02.02.2008 - <a href="index.html">article tag</a> - <a href="index.html">14 comments</a></p>
          <p>A spatial point is a concept used to define an exact location in space. It has no volume, area or length, making it a zero dimensional object.</p>
        </div>
        <div class="item last">
          <h3>Article Heading</h3>
          <p class="info">02.02.2008 - <a href="index.html">article tag</a> - <a href="index.html">14 comments</a></p>
          <p>A spatial point is a concept used to define an exact location in space. It has no volume, area or length, making it a zero dimensional object.</p>
        </div>
      </div>
      <div class="col2 right">
        <a href="index.html"><img src="img/image.gif" width="123" height="81" alt="" class="left" /></a>
        <a href="index.html"><img src="img/image.gif" width="123" height="81" alt="" class="right" /></a>
        <a href="index.html"><img src="img/image.gif" width="123" height="81" alt="" class="left" /></a>
        <a href="index.html"><img src="img/image.gif" width="123" height="81" alt="" class="right" /></a>
      </div>
      <!-- /#cols 50:50 -->
    </div>
    <!-- /#obsahovy blok -->
    
    <hr class="hidden" />
    
    <!-- #pravy blok - nabidka submenu a dalsi prvky -->
    <div id="menuBlock">
      <!--
        #zachovani shodneho odsazeni boxu v prave casti obsahu
          - uzavreni do konstrukce s tridou "box" zpusobi odsazeni nasledujiciho elementu
          
        #moznosti boxu prave nabidky
          - prvni element praveho sloupce musi byt definovan i tridou "firstBox" - vykresleni stinu
          - element obsahujici submenu musi obsahovat tridu "subMenu"
          - element obsahujici ostatni obsahove prvky (seznamy, formulare, obrazky) musi byt zalozen na tride "boxText"
          
        #aktivni zalozka oznacena v elementu li tridou "active"
      -->
      <div class="box firstBox subMenu">
        <h3>Categories:</h3>
        <ul>
          <li><a href="index.html">About me</a></li>
          <li><a href="index.html">Photos</a></li>
          <li><a href="index.html">Portfolio</a></li>
          <li class="active"><a href="index.html">Categories</a></li>
          <li><a href="index.html">Archive</a></li>
          <li><a href="index.html">Contact</a></li>
        </ul>
      </div>
      <div class="box boxText">
        <h3>Personal profile:</h3>
        <p><strong>Name Surename</strong><br />Age:&nbsp;25&nbsp;years<br />Status:<br />email:&nbsp;<a href="index.html">email@email.com</a></p>
      </div>
      <div class="box subMenu">
        <h3>Archive:</h3>
        <ul>
          <li><a href="index.html">January 2008</a></li>
          <li><a href="index.html">February 2008</a></li>
          <li><a href="index.html">March 2008</a></li>
          <li><a href="index.html">April 2008</a></li>
          <li><a href="index.html">May 2008</a></li>
        </ul>
      </div>
    </div>
    <!-- /#pravy blok -->
  </div>
  
  <!-- #pristupne prvky stranky - neodstranovat !!! -->
  <hr class="hidden" />
  <ul class="hidden">
    <li><a href="#view">Nahoru</a></li>
    <li><a href="#content">Zpet na obsah</a></li>
  </ul>
  <hr class="hidden" />
  <!-- /#pristupne prvky stranky - neodstranovat !!! -->
  
  <div id="foot">
    <p class="fl">&copy; all rights reserved</p>
    
    
    
    <!-- /#   LINKS AND AUTHOR-SIGNATURE CANNOT BE REMOVED !!! -->
    <p class="fr"><a href="http://www.breezy.cz/reference/webove-sablony-zdarma" title="More free templates coming soon">Free template</a> created by <a href="http://www.breezy.cz" class="ico ico-breezy">Breezy New Media</a> | <a href="http://free-templates.ru" class="ico">free-templates.ru</a></p>
  </div>
</div>

</body>
</html>

   
    
    
  








Related examples in the same category

1.newave
2.newdarkside
3.newday
4.newera
5.newfangled
6.newgreeny
7.newgreys
8.newhorizon
9.news portal
10.news-print
11.newsbeat
12.newsflash
13.newsportal
14.newsroll
15.newstheme
16.newwave-business-inc
17.new_rise
18.NiceSite
19.nimbuslike
20.nixed
21.noimages
22.noname1
23.nonzero
24.nothingfanzy
25.nourish
26.nowhere
27.NuahSwirl
28.nullbullum
29.numerology
30.o-no-typography
31.obsess
32.obsession
33.obtanium
34.office-plants
35.offlimits
36.offrecord
37.oheon_com_110100021
38.ohgreenworld
39.Okeanos
40.old-wall
41.oldarchitecture
42.Olive
43.one-penny
44.one_two_three
45.online-edu
46.onlinemoviestore
47.oodles
48.openyourwindows
49.opposed
50.optimal-touch
51.orchidaceae
52.ordinaire
53.ormeggiare
54.ornamental
55.ornate
56.OrngBlu
57.oswd_blozilla
58.our-work
59.ourhouse
60.outdoorv1.0
61.outliers
62.outoftheblue
63.outtabox
64.oxidation
65.package
66.paddy-harvest
67.pagedrape
68.paivi-k
69.paleforest
70.palmtrees
71.pamphlet
72.pancorbo
73.papira
74.paradigm
75.paradise1983
76.parchmenter
77.particle
78.particles
79.pastel
80.pastelco
81.pastelflowers
82.pastries
83.path-fider
84.patternmaker
85.PattyMcFatPat01
86.PattyMcFatPat03
87.pc
88.Pear Template
89.pear
90.pedestrian
91.penchantforphotos
92.pencilpink
93.people
94.perfectblemish
95.performance
96.perplex
97.personified
98.pillars
99.pills
100.pinnacle
101.Pistachio
102.pixabella
103.pixabella04
104.pixabella06
105.pixelationingreen
106.plaidshirt
107.plainandsimple
108.planning-feed
109.pluralism
110.plurkified
111.pollinate
112.pollinating
113.pollination