Come impostare un bordo per un tag div HTML


193

Sto cercando di definire un bordo attorno a un tag div in HTML. In alcuni browser il bordo non viene visualizzato.

Ecco il mio codice HTML:

<div id="divActivites" name="divActivites" style="border:thin">
    <textarea id="inActivities" name="inActivities" style="border:solid">
    </textarea> 
</div> 

Come posso impostare un bordo per un tag div HTML?

Risposte:


361

Prova ad essere esplicito su tutte le proprietà del bordo. Per esempio:

border:1px solid black;

Vedi Proprietà stenografia di confine . Sebbene gli altri bit siano opzionali, alcuni browser non impostano la larghezza o il colore su un valore predefinito che ti aspetteresti. Nel tuo caso scommetterei che è la larghezza che è zero se non specificato.


1
Ho dovuto rimuovere il suffisso "px".
samis,

1
@samis Non è quello che vuoi fare.
Gioele,

29

poter usare

border-width:2px;
border-style:solid;
border-color:black;

o come stenografia

border: 2px solid black

17

Secondo il W3C:

Poiché il valore iniziale degli stili del bordo è "nessuno", nessun bordo sarà visibile a meno che non sia impostato lo stile del bordo.

In altre parole, è necessario impostare uno stile del bordo (ad es. solid) Affinché il bordo venga visualizzato. border:thinimposta solo la larghezza. Inoltre, il colore sarà lo stesso del colore del testo (che normalmente non ha un bell'aspetto).

Consiglio di impostare tutti e tre gli stili:

style="border: thin solid black"

5

Immagino che sia qui che stai indicando ..

<div id="divActivites" name="divActivites" style="border:thin">
    <textarea id="inActivities" name="inActivities" style="border:solid">
    </textarea> 
</div> 

Bene. deve essere scritto comeborder-width:thin

Qui vai con il link (clicca qui) controlla i diversi tipi di stili di bordo

puoi anche impostare la larghezza del bordo scrivendo la larghezza in termini di pixel .. (come la larghezza del bordo: 1px), la larghezza minima è 1px.


5

Puoi usare:

border-style: solid;
border-width: thin;
border-color: #FFFFFF;

Tuttavia, puoi modificarli come meglio credi.


2

Devi impostare più campi quindi solo la larghezza del bordo. Lo stile fondamentalmente mette il bordo sulla pagina. Larghezza controlla lo spessore e il colore indica il colore per creare il bordo.

border-style: solid; border-width:thin; border-color: #FFFFFF;

1

In bootstrap 4, puoi usare le utilità dei bordi in questo modo.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

<style>
  .border-5 {
    border-width: 5px !important;
  }
</style>

<textarea class="border border-dark border-5">some content</textarea>


0
 .centerImge {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        height:50%;
    }
 <div>
 @foreach (var item in Model)
{
<span> <img src="@item.Thumbnail"  class="centerImge" /></span>
  <h3 style="text-align:center">  @item.CategoryName</h3>
}
 </div>

-3
<style>
p{border: 1px solid red}
div{border: 5px solid blue}

Chiamami Ismaele.

Non chiamarmi tardi per cena.

Chiamami Ismaele.

Non chiamarmi tardi per cena.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.