Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
- Friends
-
im new to css but i know how to do a horizontal menu but i want to make a gradiated one is it possible?
-
By gradiated, do you mean the buttons in gradual steps up or down, or with a gradiated colouring?
-
yes i do
-
<html>
<head>
<style type="text/css">
<!--
ul {padding: 0; margin-top: 10px; list-style-type: none;}
li {color: white; background-color: inherit;}
.step1 {}
.step2 {margin-left: 20px;}
.step3 {margin-left: 40px;}
.item1 {background-color: #000; color: inherit;}
.item2 {background-color: #333; color: inherit;}
.item3 {background-color: #666; color: inherit;}
ul#steps li {width: 100px; background-color: #333; color: white;}
ul#gradient li {float: left; width: 20px;}
-->
</style>
</head>
<body>
<h1>(A) "Gradiate" = steps</h1>
<ul id="steps">
<li class="step1">item1</li>
<li class="step2">item2</li>
<li class="step3">item3</li>
</ul>
<h1>(B) "Gradiate" = color transition</h1>
<ul id="gradient">
<li class="item1"> </li>
<li class="item2"> </li>
<li class="item3"> </li>
</ul>
</body>
</html>
1 to 4 of 4