Kako ustvariti ikono za USB ključ?
Naloga je enostavna. Potrebovali boste ikono in datoteko. V datoteki autorun.inf boste računalniku dali navodilo, katero ikono naj uporabi za USB.
Potek:
1.) Odprite program za urejanje golega besedila in ustvarite novo tekstovno datoteko. Če uporabljate Windowse, lahko uporabite Notepad, oz. Beležnico.
2.) V datoteko zapišite 2 vrstici:
[autorun]
icon=autorun.ico
3.) Datoteko shranite pod imenom autorun.inf in jo shranite v osnovni direktorij na USB ključu.
4.) Na isto mesto shranite tudi izbrano ikono, kateri dajte isto ime, kot je navedeno v drugi vrstici v datoteki autorun.inf. Zapis autorun.ico je ime ikone. Lahko ga spremenite, vendar mora ohraniti končnico .ico.
5.) USB ključ odstranite iz računalnika in ga znova vtaknite v USB režo.
Še nimate datoteke tipa .ico?
Ikono lahko naložite z interneta, ali pa ustvarite novo iz običajne slikovne datoteke tipa .jpg, .png, .gif, ipd.
Iskanje ikone…
Google npr. omogoča iskanje slikovnih datotek. V naprednem načinu iskanja lahko izberete, naj bo velikost slike ikona.
Ustvarjanje ikone…
Na internetu lahko najdete spletna orodja za brezplačno ustvarjanje ikon v nekaj sekundah. Na iskalniku iščite pod geslom “free online .ico generator”. Eden takih je npr. http://tools.dynamicdrive.com/favicon/.
CSS div blok zaokroženi robovi
Prava nadloga v oblikovanju div blokov so zaokroženi robovi. Vsak brskalnik zahteva svoje nastavitve. Denimo, da želim izrisati preprost div blok razreda div-blok z robom radija 4px. Da bi nalogo rešil s pripravljenimi fancy css rešitvami, lahko nad blokom uporabim
.div-blok{
border: 1 px solid black /* Izrišem črn rob okoli bloka div */
-moz-border-radius: 4px; /* Firefox */
-webkit-border-radius: 4px; /* Safari in Google Chrome */
border-radius: 4px; /* Opera 10.5+, bodoči brskalniki, in tudi Internet Explorer 6+, ki uporablja IE-CSS3 */
}Takoj naletim na problem IE brskalnikov, ki uporabljajo CSS2. Zaokroženi robovi odpadejo. Na strani http://fetchak.com/ie-css3/ sicer najdemo lepo rešitev, ki pa zna biti v več gnezdenih div blokih težavna. Na strani, kjer uporabim zaokrožen div blok, namreč najpogosteje uporabim več zaokroženih elementov (gumbi, menu, bloki za naslov, telo članka, stranski menu, komentarji, noga,… ). Stvar postane tečna, tudi z-indeksi morajo biti usklajeni in se hitro tepejo s kakšnimi vtičniki za prikaz galerij, ipd.
Rešitev je seveda na dlani – div bloki, ki uporabijo za robove slike. Toda: to lahko preide v pretirano zapravljanje časa. Naknadno prilagojevanje barv še posebej, ko je treba uskaditi vse elemente na strani in je vsak izmed njih sestavljen iz več slik.
<!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>
<title>Funkcionalen div blok z robovi brez slik</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.div-blok-zgoraj, .div-blok-spodaj {display:block; background:transparent; }
.prva-vrstica, .druga-vrstica, .tretja-vrstica, .cetrta-vrstica {display:block; overflow:hidden;}
.prva-vrstica, .druga-vrstica, .tretja-vrstica {height:1px;}
.druga-vrstica, .tretja-vrstica, .cetrta-vrstica {background:#ccc; border-left:1px solid #08c; border-right:1px solid #08c;}
.prva-vrstica {margin:0 5px; background:#000;}
.druga-vrstica {margin:0 3px; border-width:0 2px;}
.tretja-vrstica {margin:0 2px;}
.cetrta-vrstica {height:2px; margin:0 1px;}
.div-blok-vsebina {display:block; background:#ccc; border:0 solid #000; border-width:0 1px;}
#div-blok h2, #div-blok p {padding: 0px 10px; margin: 0px 10px;}
</style>
</head>
<body>
<div id="div-blok">
<strong class="div-blok-zgoraj">
<strong class="prva-vrstica"></strong>
<strong class="druga-vrstica"></strong>
<strong class="tretja-vrstica"></strong>
<strong class="cetrta-vrstica"></strong>
</strong>
<div class="div-blok-vsebina">
<h2>Zaokroženi robovi div bloka</h2>
<p>Pred vami je css div blok z zaokroženimi robovi brez uporabe slik, funkcionalen v vseh brskalnikih.</p>
</div>
<strong class="div-blok-spodaj">
<strong class="cetrta-vrstica"></strong>
<strong class="tretja-vrstica"></strong>
<strong class="druga-vrstica"></strong>
<strong class="prva-vrstica"></strong>
</strong>
</div>
</body>
</html>