Hallo teman-teman, Bertemu kembali dengan saya dan masih diwebsite ini. Seperti biasa ya teman-teman, semoga masih diberikan kesehatan dan kebahagiaan agar dapat kembali semangat dalam mencari informasi atau ingin mengupgrade skill didunia website terutama dalam hal desain website.

Pada Kesempatan kali ini saya akan membahas tentang Cara Membuat Shapes Triangle dengan CSS3. Dengan adanya CSS ini, tampilan website menjadi jauh lebih indah. maka didalam CSS terdapat banyak property-property yang tidak kalah dengan fitur-fitur yang ada di software design lainnya seperti contohnya adobe photoshop. Dan dalam membuat shapes ini saya rasa pada photoshop cukup mudah ya teman-teman hanya dengan klik sekali tool shapes yang terdapat pada tools box photoshop teman-teman sudah dapat dengan mudah membuat shapes dengan berbagai macam model.

Dibawah ini  contoh tools shape yang terdapat pada photoshop :

cara-membuat-shapes-triangle-dengan-css3

Lalu bagaimana Cara Membuat Shapes Triangle dengan CSS3 ? oke, sebelum kita memulai dalam Membuat Shapes Triangle dengan CSS3 hal yang harus diperhatikan yaitu teman-teman harus sudah lebih dahulu mengenal dengan yang namanya HTML dan CSS. Jika teman-teman sudah mengenalnya maka langsung saja kita mulai Cara Membuat Shapes Triangle dengan CSS3.

Pertama-tama teman-teman buka/jalankan text editor yang teman-teman gunakan, dan disini saya menggunakan sublime-text sebagai text editornya. Jika sudah, teman-teman ketik script HTML dibawah ini :

Jika sudah, silahkan teman-teman simpan dengan nama shapes.html, lalu langkah selanjutnya teman-teman masukan script CSS nya seperti dibawah ini dan meletakannya diantara tag head atau dibawah tag title pada html

Jika sudah dengan code HTML dan CSSnya, langkah selanjutnya silahkan teman-teman kembali ke file shapes.htmlnya lalu teman-teman jalankan/run pada browser yang teman-teman gunakan. Jika berhasil maka hasilnya akan seperti pada gambar dibawah ini :

cara-membuat-shapes-triangle-dengan-css3

Bagaimana ? cukup mudah kan teman-teman, jadi kurang lebihnya ya seperti itu dalam Membuat Shapes Triangle dengan CSS3. Sangat jauh berbeda ya teman-teman dari yang menggunakan photoshop dan dengan menggunakan HTML dan CSS. Untuk kedepannya silahkan teman-teman coba-coba modif sendiri dengan acuan contoh shapes triangle diatas.

Oke kalau begitu cukup sekian pembahasan kali ini tentang Cara Membuat Shapes Triangle dengan CSS3. Semoga dapat bermanfaat buat teman-teman dan sampai bertemu di pembahasan selanjutnya.

Terimakasih