Articles of css shapes

Come creare un triangolo arrotondato a 3 angoli nei CSS

Mi piacerebbe ottenere una forma colorata come questa senza Javascript: Attualmente sto sovrapponendo un’immagine del ‘frame’ su un div rettangular arancione, ma questo è piuttosto hacky. Suppongo che potrei usare un elemento canvas generato dynamicmente, ma che non solo richiede JS, ma il supporto canvas HTML5. Qualche idea?

Centro Triangolo in fondo a Div

Sto provando ad avere un triangolo / freccia nella parte inferiore del mio eroe, ma non è reattivo e non funziona molto bene sul cellulare poiché il triangolo fluttua a destra e non è più centrato. Come posso mantenere il triangolo posizionato nel centro assoluto nella parte inferiore del div in ogni momento? Esempio di […]

Doppia forma curva

Attualmente sto tentando di generare una forma di “fondo ondulato spettrale”. Questa forma contiene due doppie curve: Anche se la parte inferiore di questa immagine la ritrae in immagini migliori. Il mio codice La mia corrente Tentativo di generare questa forma utilizzava pseudo elementi e overflow: hidden , sebbene ciò non consenta uno sfondo sfumato […]

Come ottenere angoli di confine CSS smussati anziché angoli arrotondati?

Con la proprietà CSS border-radius posso avere un angolo sinuoso e arrotondato alla fine. .boxLeft{ border-right: 1px dashed #333; border-bottom: 1px dashed #333; border-radius: 0 0 10px 0; } .boxRight{ border-left: 1px dashed #333; border-bottom: 1px dashed #333; border-radius: 0 0 0 10px; } Ma voglio un angolo di confine come l’immagine qui sotto. Se […]

Rendere il bordo del triangolo frastagliato in CSS

Ho una forma con un bordo come questo in Photoshop: È ansible rendere i triangoli ripetuti come un confine con i CSS?

Creazione di una forma trapezoidale di Isocele

Mi chiedo se potrei produrre qualcosa di simile a questo con i CSS: E mi sto anche chiedendo, è questo il posto giusto per una domanda del genere? Non ho provato nulla in codice, ho fatto le immagini marroni con Photoshop. Grazie per qualsiasi aiuto !

Come disegnare un trapezio / trapezoide con css3?

Quando vai alla pagina http://m.google.com utilizzando Mobile Safari, vedrai la bellissima barra nella parte superiore della pagina. Voglio disegnare dei trapezi (US: trapezi) in questo modo, ma non so come. Dovrei usare css3 3d transform? Se hai un buon metodo per realizzarlo, per favore dimmelo.

Come creare una cerchia attorno ai contenuti usando i CSS?

Come questo Con solo questo codice 1

Bordo con una freccia centrata trasparente

Sto provando a disegnare un div con un bordo inferiore che abbia una freccia rivolta verso il basso . Il div avrà un’immagine al suo interno e non dovrebbe avere un bordo superiore, destro o sinistro. Il riempimento della freccia rivolta verso il basso dovrebbe essere uguale al div o trasparente. Sono stato in grado […]

Arrow Box con CSS

Come posso creare questa scatola in CSS? Ho visto alcuni tutorial che insegnano come creare scatole con le frecce, tuttavia, nel mio caso, nessuno di questi tutorial è adatto.