Results 1 to 8 of 8

Thread: HTML/CSS

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Registered User
    Join Date: Jul:2009
    Location: Sofia
    Posts: 99

    HTML/CSS

    . navigation bar-. , .


    1
    2
    3

    '' , '1' '' , '1'. HTML CSS. , .

  2. #2

  3. #3
    Registered User korben's Avatar
    Join Date: Nov:2010
    Location:
    Posts: 32
    , .

    html-, , . dropdown :

    HTML
    Code:
            	<div id="menu">
                	<ul>
                    	<li> <a href="index.php">  </a></li>
                        <li> <div class="pr"><a href="products.php"></a></div>
                        	<ul>
                            <li> <div class="pr2"><a href="monitorps.php"></a></div>
                            	<ul>
                                <li><a href="asus.php"> ASUS</a> </li>
                                <li><a href="dell.php"> DELL</a> </li>
                                <li><a href="aoc.php"> AOC</a> </li>
                                <li><a href="hp.php"> HP </a></li>
                                <li><a href="eizo.php"> EIZO</a> </li>
                                <li><a href="acer.php"> ACER</a> </li>
                                </ul>
                                </li>
                            <li><a href="mb.php">  </a> 
                                                    	<ul>
                                <li><a href="asus.php"> ASUS</a> </li>
                                <li><a href="dell.php"> FOXCONN</a> </li>
                                <li><a href="aoc.php"> ASROCK</a> </li>
                                <li><a href="hp.php"> GIGABYTE </a></li>
                                <li><a href="eizo.php"> ECS</a> </li>
                                <li><a href="acer.php"> MSI</a> </li>
                                </ul>
                                </li>
                            <li><a href="hdd.php">  </a>
                                                                            	<ul>
                                <li><a href="asus.php"> Hitachi</a> </li>
                                <li><a href="dell.php"> WD</a> </li>
                                <li><a href="aoc.php"> Seagate</a> </li>
                                </ul>
                                </li>
                            <li><a href="ram.php">  </a>
                                                                            	<ul>
                                <li><a href="asus.php"> Corsair</a> </li>
                                <li><a href="dell.php"> Geil</a> </li>
                                <li><a href="aoc.php"> OCZ</a> </li>
                                <li><a href="hp.php"> Kingston </a></li>
                                <li><a href="eizo.php"> Supertalent</a> </li>
                                </ul>
                                </li>
                            <li><a href="cpu.php"> </a>
                                                                            	<ul>
                                <li><a href="asus.php"> AMD </a> </li>
                                <li><a href="dell.php"> INTEL</a> </li>
                                </ul>
                                </li>
                            <li><a href="vga.php"> </a>
                                                                            	<ul>
                                <li><a href="asus.php"> Sapphire </a> </li>
                                <li><a href="dell.php"> Gainward </a> </li>
                                <li><a href="aoc.php"> XFX </a> </li>
                                <li><a href="hp.php"> ASUS </a></li>
                                <li><a href="eizo.php"> MSI</a> </li>
                                <li><a href="acer.php"> Gigabyte</a> </li>
                                </ul>
                                </li>
                            </ul>
                            </li>
                        <li> <a href="config.php"></a> </li>
                        <li><a href="aboutus.php">  </a> </li>
                        <li><a href="contacts.php">  </a></li>
                     </ul>
                </div>
    CSS

    Code:
    #menu li {
    	float: left;
    	list-style:none;
    	font-size: 120%;
    	text-shadow: 0 1px 1px #fff;
    		padding-right: 40px;
    		margin-right: 10px;
    		margin-left: 0!important;
    		padding-left: 0!important;
    		padding: 10px;
    }
    
    #menu ul ul {
    	display: none;
    	z-index:10;
    }
    	#menu ul li:hover > ul {
    		display: block;
    	}
    
    
    #menu ul {
    	padding: 0 10px;
    	list-style: none;
    	position: relative;
    	display: inline-table;
    	margin-bottom:0!important;
    }
    	#menu ul:after {
    		content: ""; clear: both; display: block;
    	}
    	#menu ul li {
    		float: left;
    	}
    		#menu ul li:hover {
    		}
    			#menu ul li:hover a {
    				color: #fff;
    				
    			}
    		
    		#menu ul li a {
    			display: block; padding: 5px 10px;
    			padding-right: 15px;
    			color: #757575; text-decoration: none;
    		}
    			
    		
    	#menu ul ul {
    		background: #b5cfe6; border-radius: 0px; padding: 0;
    		position: absolute; top: 100%;
    		color: #757575;
    	}
    		#menu ul ul li {
    			float: none; 
    			border-bottom: 1px solid #fff; position: relative;
    		}
    			#menu ul ul li a {
    				padding: 5px 10px;
    				color: #757575!important;
    				font-size:75%;
    			}	
    				#menu ul ul li a:hover {
    					color: #fff!important;
    				}
    		
    	#menu ul ul ul {
    		position: absolute; left: 100%; top:0;
    		color: #757575;
    		border-left:1px solid #fff;
    	}
    	#menu ul ul ul li a {
    		font-size: 65%;
    	}
    - CSS Dropdown menu
    8 hobbits = 1 hobbyte

  4. #4
    Registered User
    Join Date: Jul:2009
    Location: Sofia
    Posts: 99
    , . . , HTML CSS , . , , . HTML , CSS CSS , . , CSS . Reset Startup CSS , default . , CSS , . , Reset , .
    : HTML CSS , , CSS , , - , HTML CSS, , .

  5. #5
    Registered User korben's Avatar
    Join Date: Nov:2010
    Location:
    Posts: 32
    , ul li-, - #menu
    8 hobbits = 1 hobbyte

  6. #6
    Registered User
    Join Date: Jul:2009
    Location: Sofia
    Posts: 99
    . .

  7. #7
    Registered User
    Join Date: Mar:2008
    Location: Buglaria
    Posts: 86
    ?! ?! important, ?! , , <div style="block !important" />, ...

    Dropdown - '' , :

    HTML Code:
    #navigation li { position:relative; }
    #navigation ul ul { position:absolute; top:100%; left:0; display:none; }
    #navigation ul ul ul { top:0; left:100%; }
    
    #navigation li:hover > ul { display:block; }
    , .

    PS. 'core' dropdown. . HTML :
    HTML Code:
    <div id="#navigation">
      <ul>
        <li>
          <a href="#">Nav 1</a>
          <ul>
             <li><a href="#">DD 1</a></li>
    .....

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Copyright © 1999-2011 . .
iskamPC.com | mobility.BG | Bloody's Techblog | | 3D Vision Blog |