Ho div per casella di anteprima HTML: PREVIEW CSS: .preview-content { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAGklEQVQIW2NkYGD4D8SMQAwGcAY2AbBKDBUAVuYCBQPd34sAAAAASUVORK5CYII=) repeat; width: 100%; min-height: 300px; max-height: 300px; line-height: 300px; text-align: center; vertical-align: middle; font-size: 2em; } Q: come aggiungere linee diagonali per divare lo sfondo come nell’immagine nota: con CSS solo se ansible Grazie in anticipo
Voglio sapere se è ansible aggiungere un border nel mio clip-path:polygon(); stile o un altro modo per aggiungere un bordo? come: border:5px solid red; CSS .poligon { display: inline-block; position:relative; width:150px; height:150px; background: black; box-sizing:border-box; padding:55px; } .poligon img { display: inline-block; border:5px solid red; width:150px; height:150px; -webkit-clip-path: polygon(92.32051% 40%, 93.79385% 43.1596%, 94.69616% 46.52704%, 95% […]
È ansible rendere il testo allineato a sinistra su una linea inclinata ? l’allineamento dovrebbe seguire l’immagine inclinata inclinata con il supporto richiesto per IE9 +? Il mio codice di esempio: img { display: block; float: left; transform: rotate(-5deg); margin: 0 15px; } Lorem ipsum dolor sit amet. Vestibulum commodo volutpat a, convallis ac, laoreet […]
Ho giocato con i CSS solo per poco tempo e sto provando ad avere una scatola normale ma con l’angolo in alto a sinistra tagliato con un angolo di 45 gradi. Neppure una piccola quantità; Sto guardando un angolo piuttosto grande tagliato a quell’angolo. Questo effetto: Come dovrei farlo?
Ho trovato questo esempio su StackOverflow: Disegna il cerchio usando solo CSS Che è grandioso. Ma mi piacerebbe sapere come modificare quell’esempio in modo da poter includere il testo nel mezzo del cerchio? Ho anche trovato questo: Centrare verticalmente e orizzontalmente il testo in cerchio in CSS (come il badge di notifica di iPhone) ma […]
Ho appena trovato un trucco CSS accurato. Guarda il violino … .tooltiptail { display: block; border-color: #ffffff #a0c7ff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px; } .anothertail { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-tail2.png); display: block; height: 29px; width: 30px; } Cool Trick: How do I get this effect with only CSS? Questo crea un piccolo […]
È ansible creare “CSS3 Transform Skew One Side” Ho trovato una soluzione, ma non mi è utile, perché ho bisogno di usare un’immagine per lo sfondo (non il colore) #skewOneSide { border-bottom: 40px solid #FF0000; border-left: 50px solid rgba(0, 0, 0, 0); height: 0; line-height: 40px; width: 100px; } Anche questo JsFiddle non è utile […]
Ecco un semplice esempio convesso. http://jsfiddle.net/swY5k/ #test{ width: 200px; height: 200px; background: #888888; border-radius: 50px; } Tuttavia, voglio un raggio di confine concavo. Ho provato a rendere negativo il bordo-raggio, ma questo non ha funzionato. Esempio di concavo / convesso:
È ansible riprodurre questa immagine usando solo i CSS? Voglio applicare questo al mio menu, quindi lo sfondo marrone appare hover al hover del hover Non so come farlo, ho solo; .menu li a:hover{ display:block; background:#1a0000; padding:6px 4px; }
Ho bisogno di implementare una forma d’onda con CSS3, ho cercato di implementare con CSS3 Shapes, ma non ho raggiunto il risultato desiderato. * { margin: 0; padding: 0; } body { background: #007FC1; } .container, .panel { border-bottom: 4px solid #B4CAD8; } .container { background-color: #fff; } .container > .text { padding: 0.5em; } […]