Beispiel anhang Fake book Sichbar nur eingelogt aus Sicherheit
http://champstyle...page_id=94
ist auch erweider paar wer es braucht
Code <style type="text/css">
* {
margin: 0px;
padding: 0px;
}
body, html {
background: #ccc;
}
#fb {
width:300px;
height: 298px;
position: absolute;
left: 10px;
top: 50px;
background: #fff;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
background:-moz-linear-gradient(top, #31446E, #608CD4);
background:-webkit-gradient(linear, left top, left bottom, from(#31446E), to(#608CD4));
-webkit-box-shadow: 5px 5px 14px #fff, -5px 5px 14px #fff, 5px -5px 14px #fff, -5px -5px 14px #fff;
-moz-box-shadow: 5px 5px 14px #fff, -5px 5px 14px #fff, 5px -5px 14px #fff, -5px -5px 14px #fff;
box-shadow: 5px 5px 14px #fff, -5px 5px 14px #fff, 5px -5px 14px #fff, -5px -5px 14px #fff;
overflow: hidden;
}
#fb #letterV {
position: absolute;
top: 66px;
left: 168px;
width: 50px;
height: 220px;
background: #fff;
border: 1px solid #3D5A93;
z-index: 100;
}
#fb #letterVE {
position: absolute;
top: 220px;
left: 169px;
width: 50px;
height: 66px;
background: #fff;
z-index: 151;
}
#fb #letterH {
position: absolute;
top: 110px;
left: 141px;
width: 117px;
height: 39px;
background: #fff;
border: 1px solid #3D5A93;
z-index: 101;
}
#fb #letterHE {
border-color: #fff transparent transparent transparent;
border-style:solid;
border-width:39px 5px 0px 0px;
width:10px;
height:0;
position: absolute;
left: 249px;
top: 111px;
z-index: 102;
}
#fb #letterVH {
position: absolute;
top: 109px;
left: 169px;
width: 50px;
height: 45px;
background: #fff;
border: 0px;
z-index: 102;
}
#fb #letterT {
position: absolute;
top: 24px;
left: 168px;
width: 95px;
height: 42px;
background: #fff;
border: 1px solid #3D5A93;
border-bottom: 0px;
z-index: 101;
border-top-left-radius: 50px;
-moz-border-radius-topleft: 50px;
-webkit-border-top-left-radius: 50px;
z-index: 103;
}
#fb #letterTE {
border-color: #fff transparent transparent transparent;
border-style:solid;
border-width:42px 6px 0px 0px;
width:10px;
height:0;
position: absolute;
left: 255px;
top: 25px;
z-index: 105;
}
#fb #letterTR {
position: absolute;
top: 47px;
left: 199px;
width: 30px;
height: 20px;
background: none;
border-left: 20px solid #fff;
border-top: 20px solid #fff;
border-top-left-radius: 60px;
-moz-border-radius-topleft: 60px;
-webkit-border-top-left-radius: 60px;
z-index: 104;
}
#fb #bgT {
z-index: 10;
border-radius: 600px;
-moz-border-radius: 600px;
-webkit-border-radius: 600px;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.1)), to(rgba(255,255,255,0.1)));
background-image: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 95%);
position: absolute;
top: -840px;
left: -345px;
height: 1000px;
width: 1000px;
}
#fb #bgB {
z-index: 150;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
background: #E6F0FF;
opacity:0.5;
position: absolute;
left: 8px;
top: 220px;
width: 281px;
height: 66px;
border: 1px solid #4061A6;
}
</style>
<div id="fb">
<p id="bgT"></p>
<p id="bgB"></p>
<p id="letterV"></p>
<p id="letterVE"></p>
<p id="letterH"></p>
<p id="letterHE"></p>
<p id="letterVH"></p>
<p id="letterT"></p>
<p id="letterTE"></p>
<p id="letterTR"></p>
</div>
www.champstyle.de
|