Link su un punto della pagina

8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
Chiedo come fare per poter caricare dei link su una mia pagina del mio sito che si reindirizzano sempre sulla stessa pagina ma su un punto specifico

Ad esempio

Se nella pagina download ho caricato più download che corrispondono a più prodotti io vorrei creare dei link residenti sempre sulla stessa pagina ma che mi portano
al punto preciso del download del prodotto specifico

Spero di essere stato chiaro, un pò come fa wikipedia nei suoi link per non far scorre tutta la pagina che risulta lunga in verticale.

Grazie
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
<a href="#id_div"></a>

HTML: 
	<body>
		<div style="width: 100%; height: 50px; background: #FF00FF;" id="content">content</div>
		<div style="width: 100%; height: 50px; background: #FFFF00;" id="nav">nav</div>
		<div style="width: 100%; height: 50px; background: #FF0000;" id="footer">footer</div>
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
		<br /><a href="#nav">Torna a content</a>
		<br /><a href="#nav">Torna a nav</a>
		<br /><a href="#nav">Torna a footer</a>
	</body>
 
borgo italia

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
oppure anche così
HTML: 
<p><a name="top"></a>
bla...bla...bla...
bla
bla
...
</p>
<p><a name="primo"></a>
bla
bla
...
</p>
..ecc......
<p><a href="#top">top</a><br>
<a href="#primo">primo</a></p>
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
R

RAgazzi grazie per le risposte, ma noto una certa difficoltà nel capire i tag html e quant'altro. Mi fate un esempio pratico del link della pagina dove va posizionato nel codice?
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Non è che qualcuno non voglia aiutarti...anzi!
Il fatto è che dalle domande che fai si capisce che hai una conoscenza rasente il suolo sia di HTML che di CSS, quindi per aiutarti dovremmo scriverti almeno le nozioni base di CSS ed HTML (anche un po di teoria) che porterebbe la discussione in OT e sarebbe una perdita di tempo sia per noi che scriviamo che per te che in questo modo impareresti a spezzoni e ci capiresti poco o nulla da messaggi scritti da persone diverse.

Ti consiglio vivamente queste guide:
- HTML (Fino al capitolo 10, poi sono approfondimenti)
- CSS (I capitoli 1, 3 e 4 sono i più focali)

Comunque il CSS si "abbina" all'HTML con:
HTML: 
<link rel="stylesheet" href="css/NOMEFOGLIODISTILE.css" />
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
R

RAgazzi non ho mica detto che non mi volete aiutare, però ho letto bene le guide suggerite, ed ho potuto capire che ci sono delle regole tra css in se e tra css e html, se ho capito bene, correggetemi se ho sbagliato, mi pare di aver letto che se all'interno del codice html uso i tag per definire il colore, dove posizionarlo e magari il grassetto, posso modificare queste righe a mano senza utilizzare il css, infatti leggo che un comune browser legge quanto scritto e siccome legge prima html prima di associare ai css, come priorità verrà letto il codice html personalizzato per quella riga. giusto? Quindi per adesso mi limito a modifcare a mano la riga poi magari farò degli esercizi puntando ai link del css.

Adesso mi aiutate a focalizzare la situazione?
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Si,
quando scrivi una struttura da zero, è bene prima scrivere i codici CSS dentro l'attributo STYLE in questo modo:
HTML: 
<div style="float: left; color: FF00FF; background: #0066CC;">Contenuto del div</div>

Il vantaggio è che puoi scrivere tutto temporaneamente in questo modo per vedere da subito come appare l'output.
Dopo al div assegni un ID o una CLASSE e sposti il codice dentro il file CSS.

Io ormai parto direttamente con un CSS esterno perchè mi sta troppa fatica scrivere prima con l'attributo style e poi fare un taglia incolla continuo tra html e css.

Se credi sia meglio così puoi farlo, entrambe le soluzioni sono valide, ricorda però che gli attributi dei selettori CSS che scrivi dentro l'attributo STYLE ha la priorità su quello scritto nel CSS:
CSS
Codice: 
.div1{color: #FF0000;}

HTML: 
<div class="div1" style="color: #0000FF;">Testo</div>

La scritta dentro il div sarà di colore BLU anche se nel CSS è dichiarata ROSSO perchè il codice dentro STYLE ha la priorità.
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
R

Grazie jonny della risposta esaudiente. Non è che voglio fare così, siccome sto iniziando adesso tanto vale approfittare per approfondire, parto dal html e poi andrò ad assegnare la classe di quell'elemnto giusto? quindi se ho capito bene ecco la situzione:

posso creare infiniti elementi e posso associare infinite classi ai suddetti elementi?

Un'altra cosa che non capisco e che non ho travato nella guida letta l'elemento <div>, gli elementi devono essere per forza tutti div?

Vorrei un pò di chairezza sempre se ne avete voglia, magari mi date qualche guida dove viene evidenziato questa quesito

Grazie delle rispsote
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
8749michelep ha scritto:
...parto dal html e poi andrò ad assegnare la classe di quell'elemnto giusto?
Clicca per allargare...
Giusto!

8749michelep ha scritto:
posso creare infiniti elementi e posso associare infinite classi ai suddetti elementi?
Clicca per allargare...
Un po meno giusto, cioè, si che si possono usare anche infinite classi su di un solo elemento, però è bene assegnare massimo 2 o 3 classi altrimenti faresti prima a scrivere con lo STYLE dell'elemento.

8749michelep ha scritto:
gli elementi devono essere per forza tutti div?
Clicca per allargare...
No! il div è un contenitore ed elemento di tipo blocco:
Immagina una pagina web come una stanza, i div sono come degli scaffali (ai quali puoi dare un posizionamento, una dimensione, un colore, dei bordi...) e dentro i quali puoi mettere tutti i tuoi contenuti.
Chiaramente puoi annidarli all'infinito.
No non è necessario che tutto sia fatto a div, ma la struttura sarebbe meglio se a div, dentro a questi puoi metterci quello che ti pare tipo:
- altri div
- immagini
- testo semplice
- tabelle
di tutto insomma...

Se guardi il mio sito è fatto tutto a div.
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
Ciao jonny ho letto un pò in questi giorni ma non ho ancora capito certe cose e non riesco a fare delle prove concrete. Ho visto i tuoi div nel tuo sito solo che vorrei capire alcune altre cose. Ho notato che molti elementi sono ereditati da altri e noto anche che quando scrivi un sub div andando a capo ti sei spostato con qualche spazio. Ci sono degli spazi finiti o basta darne uno?

Codice: 
<div class="GRASSETTO">Testo in grassetto</div>
    <div class="SOTTOLINEATO">Testo sottolineato</div>
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
R

Volevo un esempio pratico di come utilizzare CSS e HTML per la mia pagina web allora:

Vorrei creare una scritta Arial in grassetto con 12 Px di grandezza, deve essere posizionata al centro della pagina ad un altezza definita da me. Come si crea il CSS in questione? mi aiuti?
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Per quanto riguarda gli spazi, io uso la tabulazione su Dreamweaver che dovrebbe equivalere a 5 spazi come dimensione.
L'indentazione serve per vedere a colpo d'occhio quali elementi sono dentro a quali, e per leggere meglio tutta la struttura.

Per la scritta, puoi fare così:
HTML: 
<div style="font-family: Arial; font-size: 12px; text-align: center;">Scritta</div>
il posizionamento verticale usa il margin-top: **px;
 
8

8749michelep

Utente Attivo
9 Mar 2013
46
0
0
www.listecanali.com
R

Jonn ha scritto:
Per quanto riguarda gli spazi, io uso la tabulazione su Dreamweaver che dovrebbe equivalere a 5 spazi come dimensione.
L'indentazione serve per vedere a colpo d'occhio quali elementi sono dentro a quali, e per leggere meglio tutta la struttura.

Per la scritta, puoi fare così:
HTML: 
<div style="font-family: Arial; font-size: 12px; text-align: center;">Scritta</div>
il posizionamento verticale usa il margin-top: **px;
Clicca per allargare...

Grazie ancora per le tante cose. mi fermo qui vorrei ancora una info di base per potermi orientare.
Io volevo creare un elemento in CSS per poi usare in HTML il nome elemento, invece noto che tu me lo hai scritto in HTML, ma c'è ancora un però, il codice che mi hai scritto non utilizza i tag HTML ma quelli di CSS, per fare questo devo partire con <div style=ecc</div>? se uso questo tag, credo che si chiami così, posso poi usare quelli per CSS?

Ti ringrazio molto per avermi seguito
 
Jonn

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
HTML: 
<div style="TUTTI I CODICI CSS"></div>
Se lo scrivi così, non ti servono CLASSI o ID per questo elemento perchè il CSS è già dentro il codice HTML.

HTML: 
<div id="esempio"></div>
<div class="esempio"></div>
Scritto in questo modo invece devi richiamare il nome ID o il nome CLASSE dal CSS che abbini all'HTML.

Gli ID in HTML li richiami da css scrivendo #nomeid
Le CLASSI in HTML le richiami da css scrivendo .nomeclasse

Prendendo per esempio i DIV di qui sopra sarebbero richiamati da CSS rispettivamente:
Codice: 
#esempio {CODICI CSS DEL PRIMO DIV}
.esempio {CODICI CSS DEL SECONDO DIV}

Ricorda che:
- Gli ID in HTML ne puoi utilizzare uno solo per ogni pagina
- Le CLASSI in HTML ne puoi utilizzare infinite nella stessa pagina e in tutte le altre

Consiglio:
Io uso gli ID per i nomi delle positions:
HTML: 
<div id="header"></div>
<div id="breadcrumb"></div>
<div id="navleft"></div>
<div id="content"></div>
<div id="navright"></div>
<div id="footer"></div>
Perchè costituiscono la struttura base della pagina e quindi in ogni pagina c'è un solo DIV id per ognuno di quelli elencati.

Le classi le uso invece per gli elementi che posso richiamare più volte, vedi nel mio sito:
- I menu a sinistra, tutti e 3 hanno la stessa classe (MENU) quindi sono identici.
- I 3 box nella home page, tutti e 3 hanno le stesse classi (BOX240, BOX240HEADER, BOX240BODY)

P.S.
Si puoi aggiungere ad un elemento HTML che ha lo STYLE anche un ID o una CLASSE ma se metti degli attributi uguali sia nel CSS che nello STYLE, quelli nell'HTML hanno la precedenza annullando quelli scritti nel CSS.
 
Ultima modifica:
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
L Write in un determinato punto da un link senza refresh Javascript 0
A Malfunzionamento Vodafone Station e Kit Powerline D-Link DHP-W311AV Adsl e Connettività 1
D [COMPRO/CERCO] GUEST POST o scambio link per sito di Spiritualità ed Esoterismo. Vendere e Acquistare pubblicita' online 0
S tracciare i link in uscita Google Analytics 1
U Link a doppio file PHP PHP 0
S [CERCO] scambio di articoli con link Offerte e Richieste di scambio links 0
U Link a pagina ed esecuzione file PHP 0
D Inserire link PHP 0
A Regex per isolare link interni con rel noopener PHP 0
Shyson Modificare codice e creare link PHP 0
M Come individuare il link sito entrante Google Analytics 1
W Elenco dei link del file presenti in una cartella PHP 2
P modifica colore A Hover link website . WordPress 2
T Offuscare link pagina web PHP 2
D Estrarre database con link esterno Database 10
W Creare link di una dato Classic ASP 0
M Visualizzare file PDF con link preso dal DB PHP 0
G Link Building da aggregatori e nuovo social network SEO e Posizionamento 1
G PHP e Microsoft Teams: generare link videocall PHP 15
Shyson Link social penalizzano il sito? SEO e Posizionamento 14
G Rendere dati di una tabella mysql link PHP 22
Shyson Mascherare link di affiliazione PHP 0
F domanda sul link juice SEO e Posizionamento 2
C Problema tp-link extender cp210 Reti LAN e Wireless 9
M [Wordpress] Slider Revolution automatic link WordPress 0
diamantetredici13 [HTML] link e poi link... HTML e CSS 2
D [WordPress] Link eliminati ancora presenti nel database, è possibile? WordPress 0
Shyson [PHP] Aggiungere link al codice PHP 0
K [PHP] Link Obfuscator PHP 5
B anomalia router TP Link Reti LAN e Wireless 0
G Inserire "Leggi il resto dell'articolo" con link al post sul sito preso via RSS Email Marketing 0
D Tp-link voip non funzionante Adsl e Connettività 0
E [HTML] non apre link a file locale ma se lo imposto su barra indirizzi lo apre HTML e CSS 3
D [HTML] Inviare un link contenente un' immagine HTML e CSS 4
M [MySQL] CREARE UN LINK SU UN DETERMINATO CAMPO DI UNA TABELLA RISULTATO DI UNA QUERY SQL MySQL 3
P [Javascript] Aprire Link in Div e pagina Dinamica Javascript 0
kikdirty cerco scambio link con siti di strumenti seo Offerte e Richieste di scambio links 0
N Scambio link sito ZA40 Offerte e Richieste di scambio links 1
Cosina Link in document ready function jQuery 0
E Validazione campi form passati da link Programmazione 0
R [PHP] [Javascript] Link a DIV id di un' altra pagina PHP 4
GiErre [PHP] [HTML] Disabilitare un link in funzione della piattaforma PHP 7
trattorino [PHP] link su stringa con @ PHP 3
P Gif animata con sezioni e link esterni in photoshop Photoshop 8
G [HTML] estrapolare link da pagina web HTML e CSS 9
G [HTML] mettere link in facebook link invece che su sito web Social Media Marketing 1
A [PHP] errore 404 e invio mai path pagina con link interrotto PHP 2
R [HTML] Immagini con link, uguali su tutte le pagine del sito HTML e CSS 3
D Scambio link in articoli sito dating Offerte e Richieste di scambio links 1
M [Javascript] [HTML] link interno Javascript 1

Discussioni simili

Alto Basso