Codici html più usati

« Older   Newer »
  Share  
view post Posted on 9/5/2011, 12:36     +5   +1   -1


風影


Group:
Administrator
Posts:
10,034
Punti:
+5
Location:
Anime Shonen Forum =D

Status:


°° Testo accapo
CODICE
[color=blue]<br>[/color]


°° Linea
CODICE
<hr>


°° Immagine
CODICE
<img src="http://indirizzo_immagine">


°° Testo con collegamento
CODICE
<a href="http://indirizzo_sito">testo</a>


°° Immagine con collegamento
CODICE
<a href="http://indirizzo_sito"><img src="http://indirizzo_immagine"></a>


°° Centrare un'immagine o un testo
CODICE
<div align="center">immagine/testo</div>


°° Immagine o testo che scorre
CODICE
<marquee direction="up" scrollAmount=1 height="30" width="70%">immagine/testo</marquee>


{direction gestisce la direzione
scrollAmount indica la velocità
heigth indica l'altezza del campo di movimento
width indica la larghezza del campo di scorrimento
}

°° Immagine o testo che scorre e si ferma al passaggio del mouse
CODICE
<marquee onmouseover="this.stop()" onmouseout="this.start()">immagine/testo</marquee>


°° Immagine o testo che scorre e rallenta al passaggio del mouse
CODICE
<marquee scrollamount='5' onMouseover='this.scrollAmount=1' onMouseout='this.scrollAmount=5'>immagine/testo</marquee>


°° Testo in grassetto
CODICE
<b>testo</b>


°° Testo in corsivo
CODICE
<i>testo</i>


°° Testo sottolineato
CODICE
<u> testo</u>


°° Testo barrato
CODICE
<s>testo</s>


°° Colore testo
CODICE
<font color="colore">testo</font>


°° Dimensione testo
CODICE
<font size="dimensione">testo</font>


°° Font testo
CODICE
<font face="font da utilizzare">testo</font>


°° Cambiare colore, font, dimensione ad un testo
CODICE
<font color="colore" size="dimensione" face="font da utilizzare">testo</font>


°° Testo con alone (visibile solo con explorer)
CODICE
<div style="width:100%;filter:glow(color=colore)">testo</div>


°° Testo sfumato (visibile solo con explorer)
CODICE
<div style="width:100%;filter:blur">testo</div>


°° Lista
CODICE
<ul type="disc">
<li>voce</li>
<li>voce</li>
<li>voce</li>
</ul>
Si può cambiare <i>disc</i> con <i>circle</i> o <i>square</i>

<ul type="disc">
<li>Disc</li>
<li>Attivato</li>
</ul>

<ul type="square">
<li>Square </li>
<li>Attivato</li>
</ul>

<ul type="circle">
<li>Circle </li>
<li>Attivato</li>
</ul>


°° Lista numerata
CODICE
<ol>
<li>voce</li>
<li>voce</li>
<li>voce</li>
</ol>
<ol>
<li>Punto</li>
<li>Punto</li>
<li>Punto</li>
</ol>


°° Area di testo
CODICE
<textarea>testo</textarea>
<textarea>area di testo</textarea>


°° Imput
CODICE
<input type="" value="testo">

<input checkbox ="" value="123"> checkbox


°° Menù a tendina
CODICE
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

Codice:
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>


°° Pulsante con testo
CODICE
<button>testo</button>


°° Testo in alto
CODICE
<sup>...</sup>


°° Testo in basso
CODICE
<sub>...</sub>


°° Immagine che si ingrandisce al passaggio del mouse
Questo codice va copiato in fondo a "modifica colori e stili"
CODICE
.thumbnail {position: relative;
z-index: 0}

.thumbnail:hover {background-color: transparent;
z-index: 9}

.thumbnail span {/*CSS for enlarged image*/
position: absolute;
background-color: none;
padding: 5px;
left: -1000px;
border: none;
visibility: hidden;
color: black;
text-decoration: none}

.thumbnail span img {/*CSS for enlarged image*/
border-width: 0;
padding: 2px}

.thumbnail:hover span {/*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */}

Questo invece nella vostra tabella nello spazio in cui volete mettere l'img
CODICE
<a class="thumbnail" href=><img src="LINK IMMAGINE PICCOLA"><span><img src="LINK IMMAGINE GRANDE"></span></a>


E infine qui c'è la spiegazione di alcune parti del codice:
CODICE
.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: none;
padding: 5px;
left: -1000px;
border: none;
visibility: hidden;
color: black;
text-decoration: none;


°° Codici per l'audio
- Per impostare una musica di sottofondo
CODICE
<bgsound src="link audio">

- Per ripetere la musica all'infinito
CODICE
<bgsound src="link audio"loop="infinite">

- Per ripetere la musica con un numero prestabilito di volte
CODICE
<bgsound src="link audio"loop="2">


°° Blocco tasto destro
-In alcuni siti o forum, quando clicchi su qualcosa ti spunta la finestrella che ti impedisce di copiare un'immagine o altro. Bene se volete mettere nel vostro forum questo blocco basterà copiare il codice qui sotto in "Gestione codici html"---> Codici in fondo al forum
CODICE
<script type="text/javascript">
<!-- Start

function right(e) {
if (navigator.appName == 'Netscape' &&
(e.which == 3 || e.which == 2))
return false;
else if (navigator.appName == 'Microsoft Internet Explorer' &&
(event.button == 2 || event.button == 3)) {
alert("scrivi qui il tuo messaggio");
return false;
}
return true;
}
document.onmousedown=right;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=right;

// end -->
</script>


°° Targhette delle sezioni opache che si illuminano al passaggio del mouse
- Questo codice va inserito in "Modifica colori e stili" in fondo a tutti gli altri codici
CODICE
/* TARGHETTE OPACHE */

.web a:link img, .web a:visited img {filter:alpha(opacity=30); -moz-opacity: 0.5; opacity: 0.5}
.web a:hover img {filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0}


°° Menù a lista
- Copiate questo in "Modifica colori e stili" in qualsiasi punto vogliate (certo non in mezzo ad altri codici se no succede un pastrocchio
CODICE
.tab a:link, .tab a:visited {display:block; color: #hex; text-align: left; background: #hex; border-left: 10px solid #hex; padding: 1px; padding-left: 3px; margin-top: 1px}
.tab a:hover {display:block; background: #hex; border-right: 10px solid #hex; text-align: right; border-left: 10px #hex solid}

- E questo qui nella vostra tabella, nello spazio in cui desiderate inserire il menù
CODICE
<div class="tab">
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
</div>


°° Codice per nascondere le sottosezione del forum
CODICE
</span><p class="nascosta"><span>


°° Sfondo nella firma
CODICE
<div style="background-color: codice colore; display: block;">contenuto della firma</div>

- Se volete un'immagine al posto di un colore dovrete sostituire
CODICE
background-color: codice colore

- Con
CODICE
background-image: link immagine


°° Per scrivere un testo al lato di un'immagine
CODICE
<div style="float: left; padding-right: 4px">[IMG]http://linkimmagine[/IMG]</div>Testo Testo Testo


°° Per scrivere nella NewsBoard
CODICE
QUI INSERISCI LA DATA<a href="URL PROFILO"><b>QUI INSERISCI IL TUO NICK</b></a>:QUI INSERISCI IL TESTO<br>


°° Bottone per aggiungere il forum tra i preferiti
CODICE
<!-- Prelevato nel Forum di Supporto di ForumFree.net e ForumCommunity.net -->
<script type="text/javascript">
var url_del_tuo_forum="http://www.forumfree.net"
var nome_del_tuo_forum="ForumFree.net"
</script>
<script type="text/javascript">function addbookmark(){if (document.all)window.external.AddFavorite(url_del_tuo_forum,nome_del_tuo_forum)}</script>
<a href="javascript:addbookmark()">Aggiungi il forum ai preferiti</a>


°° Logo che cambia con l'aggiornamento della pagina
Per fare in modo che il logo cambi ogni volta che si aggiorna la pagina del forum bisogna inanzitutto creare diversi loghi (il numero dipende da quanti loghi diversi volete vengano visualizzati) e poi bisogna inserire questo codice in gestione HTML, in cima al forum

CODICE
<script type="text/javascript"><!--
var ran=new Array();

ran[0]='<img src="indirizzo_immagine">';
ran[1]='<img src="indirizzo_immagine">';
ran[2]='<img src="indirizzo_immagine">';

var id=Math.round(Math.random()*(ran.length-1)); document.write(ran[id]);
//--></script>


NB: non bisogna inserire nessuna immagine in modifica logo perchè se no verrà visualizzata l'immagine del logo e anche quella in cima al forum. Quindi da logo farà l'immagine in cima al forum.


°°Staff in tabella con immagini che si ingrandiscono e didascalie

Prima di tutto andate in gestione codici html e inserite in cima al forum questo codice
CODICE
<style type="text/css">

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}

</style>


E poi inserite e compilate questo codice nello spazio in cui volete inserire lo staff
CODICE
<a class="thumbnail" href="#thumb"><img src="URL IMMAGINE PICCOLA DI ANTEPRIMA" width="100px" height="100px" border="0" /><span><img src="URL IMMAGINE GRANDE DA PASSAGGIO DEL MOUSE" /><br />DESCRIZIONE CHE VUOI METTERE</span></a>





Menù laterale:
Andate su:
-Amministrazione
-Gestione codici html
-In fondo al forum
-E inserite questo codice:

CODICE
<script type="text/javascript"><!--
moving=setTimeout('null',1);
function move(b){if(b<0&&parseInt(Menu.left)>-Width||b>0&&parseInt(Menu.left)<0)
{clearTimeout(moving); moving=setTimeout('move('+b+')',slideSpeed); theleft+=b; Menu.left=theleft} else{clearTimeout(moving); moving=setTimeout('null',1)}}
function startMenu(menu,barText){document.write('<div id=ssm style="width:'+(Width+30)+'px; left:-'+(Width)+'px; z-index:9; top:'+Yoffset+'px; '+(isStatic?'':'top:expression('+Yoffset+'+(y=document.body.scrollTop)+\'px\'); position:fixed!important; ')+'position:absolute" onmouseover=move(10) onmouseout="clearTimeout(moving); moving=setTimeout(\'move(-10)\',waitTime)"><table class=mainbg width=100% cellpadding=4 cellspacing=1><tr><td class=title align=center><b>'+menu+'<\/b><td class=ww rowspan=100 style="width:20px;padding:12px 4px 12px 4px;font-size:10pt;font-weight:bold" align=center valign=middle>'+barText); Menu=document.getElementById("ssm").style; theleft=-Width}
function addItem(text,link){document.write('<tr><td class=aa><span class=web><a HREF='+link+'>'+text+'<\/a><\/span>')}
function endMenu(){document.write('<\/table><\/div>')}
if(document.getElementById){

isStatic=false;
Yoffset=20;
Width=130;
slideSpeed=20;
waitTime=500;

startMenu("Menù","M<br>e<br>n<br>ù<br><br>l<br>a<br>t<br>e<br>r<br>a<br>l<br>e");

addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");


endMenu()}
//--></script>


Se al posto della scritta menu laterale volete inserire un immagine fate così:

Sostituite a questo codice

CODICE
startMenu("Menù","M<br>e<br>n<br>ù<br><br>l<br>a<br>t<br>e<br>r<br>a<br>l<br>e");


Questo qui

CODICE
startMenu("Menù","<img src=URL IMMAGINE>");

 
Web Web Contacts Contacts  Top
view post Posted on 9/5/2011, 14:13     +1   -1
Avatar

Juubi

Group:
Member
Posts:
12,573
Punti:
0

Status:


sei un mito
 
Top
view post Posted on 9/5/2011, 14:40     +1   -1


風影


Group:
Administrator
Posts:
10,034
Punti:
+5
Location:
Anime Shonen Forum =D

Status:


lo so....
 
Web Web Contacts Contacts  Top
besaggio
view post Posted on 10/5/2011, 21:19     +1   -1




Grande lord
 
Top
-Link
view post Posted on 10/5/2011, 21:38     +1   -1




Bravissimo lord u.u
 
Top
view post Posted on 11/5/2011, 05:21     +1   -1


風影


Group:
Administrator
Posts:
10,034
Punti:
+5
Location:
Anime Shonen Forum =D

Status:


presto ne aggiungerò altri
 
Web Web Contacts Contacts  Top
view post Posted on 5/7/2011, 14:39     +1   -1
Avatar

Juubi

Group:
Member
Posts:
16,871
Punti:
0
Location:
casa tua

Status:


ce n'è un po' ^^
 
Top
view post Posted on 5/7/2011, 15:23     +1   -1


風影


Group:
Administrator
Posts:
10,034
Punti:
+5
Location:
Anime Shonen Forum =D

Status:


xDDDD
 
Web Web Contacts Contacts  Top
pippo tek
view post Posted on 8/2/2012, 21:41     +1   -1




grande!!!!!!!!!!!!!!!
 
Top
[TST]LastCop™
view post Posted on 20/6/2012, 16:22     +1   -1




Bravo, ma sono gli stessi che trovate su wiki forum, sono i codici base!
 
Top
view post Posted on 20/6/2012, 16:45     +1   -1


風影


Group:
Administrator
Posts:
10,034
Punti:
+5
Location:
Anime Shonen Forum =D

Status:


boh non lo so :/ io li postai tempo fa :/
 
Web Web Contacts Contacts  Top
.:yuki:.
view post Posted on 26/8/2012, 18:04     +1   -1




emh, complimenti ma per il Codice immagine o testo che scorre e si ferma al passaggio del mouse
CODICE
<marquee onmouseover="this.stop()" onmouseout="this.start()">immagine/testo

mi dice errore ^^'' come posso fare ? per caso tra le parentesi si deve mettere qualcosa ?
 
Top
Aly12
view post Posted on 4/4/2019, 11:03     +1   -1




Hello there,

My name is Aly and I would like to know if you would have any interest to have your website here at forumcommunity.net promoted as a resource on our blog alychidesign.com ?

We are updating our do-follow broken link resources to include current and up to date resources for our readers. If you may be interested please in being included as a resource on our blog, please let me know.

Thanks,

Aly
 
Top
12 replies since 9/5/2011, 12:36   1824 views
  Share