2013-03-06 7 views
11

Ho provato a google, e sorprendentemente trovato nessun risultato correlato ... Mi chiedo come posso usare css per regolare il cursore lampeggiante all'interno della casella di ricerca con CSS? Ho regolato la dimensione della casella di ricerca, ma sembra che la dimensione del cursore lampeggiante sia ancora piccola dimensione del testo originale.Come regolare la dimensione di Caret (cursore lampeggiante) all'interno della barra di ricerca con css

+0

@ mrbinky3000 bene, questo non è un articolo (come già sapete, essendo oltre 2k rep) e, se siete a conoscenza di nuovi modi per raggiungere questo obiettivo, rispondere sarebbe più produttivo di commentare che qualcun altro dovrebbe rispondere. .. * "Sii il cambiamento che vuoi vedere nel mondo" *, e tutto il jazz;) –

+0

Possibile duplicato di [Come controllare le dimensioni del cursore/cursore con i CSS] (https://stackoverflow.com/questions/6090893/how-to-control-cursor-caret-size-with-css) – FFirmenich

risposta

3

La ricerca di cursore anziché di cursore consente di ottenere più risultati.

appearently, non è possibile in una textarea, ma è possibile in altri elementi attraverso Javascript:

Date un'occhiata a:

How to control cursor/caret size with CSS

How to modify the caret with css

e

Styling text input caret

+0

non sembra una soluzione, più di un modo complesso per affrontare la semplice regolazione. Non li userò, rimarrò come è, credo che ......Tuttavia, se qualcun altro ha una soluzione migliore che estenda effettivamente la dimensione del Caret alle dimensioni che si avvicinano al campo di input della barra di ricerca stessa, sarà apprezzato! –

0

Se tappi è ok nel vostro contesto, un semplice trucco è quello di utilizzare l'attributo CSS font-variant: small-caps; per ottenere il cursore più grande del testo.

Un altro approccio è quello di creare il proprio caret utilizzando una sostituzione del campo di input, qualcuno ha trascorso del tempo e achieved something working, ma l'autore consiglia di continuare a utilizzare il punto di inserimento standard.

-1
<style> 
.input_strips { 
font-family: monospace; 

<!--change the font size this will change the input cursor and the text box--> 
font-size: 30px; 
} 
</style> 
0

Non è possibile modificare la larghezza del cursore (almeno per ora); Ma si può cambiare il colore punto di inserimento per la maggior parte dei browser moderni

https://developer.mozilla.org/en-US/docs/Web/CSS/caret-color

input { 
caret-color: red; 
caret-color: #ff0000; 
caret-color: rgb(255, 0, 0); 
caret-color: hsl(0, 97%, 50%); 
} 
0

Per quanto ne so, non c'è modo diretto per lo stile il cursore. Invece qui ci sono alcune informazioni utili che possono aiutarti a risolvere i tuoi problemi.

Per impostazione predefinita, l'altezza del carattere prenderà l'altezza del carattere, l'unica volta che non lo farà, è quando viene specificata l'altezza della linea, quindi prenderà questa altezza.

Quindi, se si desidera modificare l'altezza del cursore, è possibile farlo attraverso la dimensione del carattere o l'altezza della linea se non si desidera modificare la dimensione del carattere.

Problemi correlati