shadow
<span style="text-shadow: #888 3px 3px 5px;">shadow</span>
Archiv für die ‘CSS’ Kategorie
CSS3: Shadow
12 Januar 2012Eine anklickbare Div – Ebene bzw. ein Button
12 Januar 2012Letztes war mal wieder ein anklickbares Div gefragt…mit Handcurser etc.
13 Artikel im Warenkorb
<div id="h12" style="cursor: pointer; background-color: #0c0; height: 50px; width: 200px; text-align: center; line-height: 50px;" title="Zum Warenkorb" onclick="location.href='shopping_cart.php'">13 Artikel im Warenkorb</div>
Wer jetzt noch mit :hover rumspielt, hat dann schon einen Button. Wow.
3D transformationen
29 Juli 2011OMG. Wo soll das hinführen?
Trotzdem toller Artikel über die neuen Möglichkeiten von CSS3 in webkit-fähigen Browser(n):, also safari und chrome.
HTML – Tags mittels Dreamwaever entfernen
28 Juli 20111.) “Edit” > “Find & Replace” (Strg + F)
2.) Auswählen: “Find in” > “Selected Text” or “Current Document” or “Folder” - gerade letzteres ist absolut sinnvoll und spart Zeit ohne Ende!
3.) Auswählen: “Search” > “Specific Tag” >
4.) Eingeben oder auswählen z.B. “<font>”
5.) Das “-” Symbol anklicken um die Tag-modifier-Optionen zu entfernen
6.) Auswählen “Action” > “Strip Tag”
7.) Klick “Replace All”
Mit den Attributs-Optionen kann man sehr gezielte Eingriffe in den Quelltext vornehmen…aber eigentlich habe ich die Funktion sehr oft zum <font> – Tag killern gebraucht.
Eine Grafik vor’m Link
28 Juli 2011background: url(/img/meinLinkIcon.png) center left no-repeat; padding-left: 13px;
textfeld und submitbutton auf einer linie
22 März 2011Letztens hatte ich doch ein Input-Feld und direkt dahinter den Button…und natürlich war der Button verschoben, d.h. nicht auf einer Linie mit dem Textfeld. Was war da nochmal zu tun?
Ach ja…
.inputField { vertical-align: middle; } .submitBtn { vertical-align: middle; }
div im div horizontal und vertikal positionieren
4 Oktober 2010<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> <!-- #center { position: absolute; left: 50%; top: 50%; width: 500px; height: 500px; line-height:500px; margin-left: -250px; margin-top: -250px; background-color:red; text-align:center; vertical-align: middle; } #inner { width: 100px; height: 100px; padding:0px; background-color:orange; position:absolute; left:50%; margin-left:-50px; top:50%; margin-top:-50px; } --> </style></head> <body> <div id="center"><div id="inner"></div></div> </body> </html>
div horizontal und vertikal zentrieren
4 Oktober 2010#center {
position: absolute;
left: 50%;
top: 50%;
width: 100px;
height: 100px;
margin-left: -50px;
margin-top: -50px;
}
Gestrichelte Linie als text-decoration bei Links
24 August 2010a {
text-decoration: none;
border-bottom: 1px dotted blue;
}
Custom font bzw. eigene Schrift verwenden…Danke CSS3!
29 Juli 2010Funkioniert auf allen CSS3-Browsern und auf dem IE dank dem ollen “eot”-format.
TTF umwandeln hier
angucken: customFont
@font-face {
font-family: MyCustomFont;
src: url("ChollUni.eot");
}
@font-face {
font-family: MyCustomFont;
src: url("ChollUni.ttf");
}
body {
font-family: MyCustomFont, Verdana, Arial, sans-serif;
font-size: medium;
color: black
}
