GyanCode

Gyancode

A free library of HTML, CSS, JS

Monday 28 November 2016

Style a Select Box

<!DOCTYPE html>
<html>
<style>
select {
border: 1px #ddd solid;
color: #333;
background: #f6f6f6;
font-weight: bold;
width: 300px;
-webkit-appearance: none;
font-size: 14px;
padding: 10px;
border-radius: 5px;
}
</style>
<body>
<select>
<option>Select an Option</option>
<option>Option 1</option>
<option>Option 2</option>
</select>
</body>

</html>

Odd Even Css

<style type="text/css">
ul li{padding:10px 30px;}
ul li:nth-child(even) {background: #CCC}
ul li:nth-child(odd) {background: #FFF}
</style>

<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

</body>

Saturday 19 November 2016

Css Only for Mozilla Browser

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Css Only for Mozilla Browser</title>
<style type="text/css">
h1{ color:#00F3FF;}
@-moz-document url-prefix() {
h1 { color: red; }
}
</style>
</head>

<body>
<h1>Demo Test Demo Test</h1>
</body>
</html>

Using @import css

<!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" dir="ltr">
<head>
<title>Using @import css</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
@import url("style.css");
</style>

</head>

<body>
</body>

</html>

Subscribe to: Posts ( Atom )