foglio di quaderno

[pulvirenti]

Salve,
volevo sapere se qualcuno mi sa dare un link dove recuperare un esempio CSS con foglio di quaderno a righe. Tipo quelli appena strappati ad un block notes o un taccuino.
Tutto questo in maniera tale che sia semplice scrivere sulle righe il testo voluto.
Come se fossero dei brevi appunti, pensieri da mettere da parte.


Ho provato a cercare in giro ma col fatto che "foglio" e "css" da adito a parecchi equivoci è un po' difficile trovare qualcosa di attinente.

Qualche suggerimento?

Grazie
Ktrl+S

[Mich_]

Per fare uno sfondo a righe non ci sono problemi. Devi fare un'immagine alta 16px, larga 1, tutta bianca e con un puntino azzurro in basso. Poi con il CSS la metti come sfondo e la fai ripetere in orizz e vert. E` una cosa che puoi realizzare in pochi minuti anche con l'applicativo paint (presente di default in quasi tutti i sistemi).

Invece quello che non si riesce a fare (con i mezzi normali) e` inserire le scritte proprio sopra le righe: infatti non puoi conoscere le dimensioni del font usato dall'utente (ormai tutti i browser permettono di ridefinirne almeno le dimensioni minime).
Puoi provare a dare:

  font: 14px/16px;
  background: #fff url(righe.gif) repeat;

Se poi la scritta non finisce sulle righe, devi modificare il background:
background: #fff url(righe.gif) repeat 0 1px;
dove al posto di 1 ci metti un numero fino a 16, o anche negativo fino a -15.

Pero` quando avrai sistemato su un browser, non e` detto che funzioni in tutti, per i motivi accennati sopra.

[pulvirenti]

Ora la sparo grossa....ma se metto dei div che disegnano la linea sotto, magari con la tecnica indicata da te, e al loro interno metto il testo?
Così non dovrei avere garantito l'allineamento di carattere e riga?

Se ho detto una cavolata chiedo umilmente perdono...

E come posso fare a realizzare la parte alta del foglio come se avessi appena strappato il foglio da un quadernino a spirale?

[Mich_]

Così non dovrei avere garantito l'allineamento di carattere e riga?

La vedo dura. E la vedo anche peggiore della mia proposta: che succede se il testo da te inserito va a capo?

E come posso fare a realizzare la parte alta del foglio come se avessi appena strappato il foglio da un quadernino a spirale?

Si puo` fare, ma credo che devi procedere per gradi.
Da quanto scrivi non mi pare che tu abbia molta esperienza ... Se metti troppa carne al fuoco rischi di bruciarla tutta.

Comunque la parte superiore devi realizzarla con un blocco a parte, che fara` la testa del tuo blocco in cui inserisci il testo. In quel caso avrai un'immagine che si ripete solo in orizzontale e che conterra` esaattamente un "buco" strappato ed eventualmetne il pezzetto di linea azzurra. Per realizzarlo puoi prendere un pezzo di carta effettivamente strappato dal quaderno e copiarlo in paint.
In linea ideale potresti usare un pezzetto scannerizzato, anche se di solito le immagini scannerizzate hanno delle sfumature che le rendono piu` pesanti delle corrispondenti immagini realizzate a px.

[pulvirenti]

Originariamente inviato da Mich_

La vedo dura. E la vedo anche peggiore della mia proposta: che succede se il testo da te inserito va a capo?

Per esempio potrei limitare il numero di caratteri per riga e fermarmi all'ultima parola intera che può entrare nella riga stessa con una certa tolleranza.

Si puo` fare, ma credo che devi procedere per gradi.
Da quanto scrivi non mi pare che tu abbia molta esperienza ... Se metti troppa carne al fuoco rischi di bruciarla tutta.

Sono a zero per quel che riguarda la grafica, ma tecnicamente sul web mi sento preparato.

Comunque la parte superiore devi realizzarla con un blocco a parte, che fara` la testa del tuo blocco in cui inserisci il testo. In quel caso avrai un'immagine che si ripete solo in orizzontale e che conterra` esaattamente un "buco" strappato ed eventualmetne il pezzetto di linea azzurra. Per realizzarlo puoi prendere un pezzo di carta effettivamente strappato dal quaderno e copiarlo in paint.
In linea ideale potresti usare un pezzetto scannerizzato, anche se di solito le immagini scannerizzate hanno delle sfumature che le rendono piu` pesanti delle corrispondenti immagini realizzate a px.

ci proverò. Grazie