Pada kesempatan kali ini, tulisan saya sedikit keluar dari tema biasanya, bukan tentang matematika namun lebih ke arah tutorial blog, yaitu cara membuat border maupun bingkai dengan postingan blog.
Postingan ini sebenarnya sebagai catatan pribadi misalnya suatu saat saya perlukan biar saya tidak perlu susah-susah lagi mencarinya, namun saya rasa tidak ada salahnya misalnya sekalian saya publikasikan agar bermanfaat bagi banyak orang.
Pada beberapa postingan saya sebelumnya seringkali saya memberi bingkai dengan formula atau hal yg dianggap penting dengan suatu tulisan, misalnya tulisan ini maupun ini. Alasan kenapa saya beri bingkai adalah untuk memberi penekanan seolah-olah saya memberi tahu pembaca "ini penting lho" :) dengan tentunya menambah nilai estetika dengan tulisan.
Pada tulisan-tulisan saya sebelumnya bingkai saya buat dengan cara menyisipkan gambar hasil sreenshoot. jadi rumus itu saya tulis terlebih berbahaya di muka dengan Ms. Word lalu saya sreenshoot dengan gambar hasilnya saya sisipkan. Cara tersebut tentu tidak salah, namun saya rasa kurang efektif. Setelah saya diskusi dengan ini namun ternyata ada kelemahannya, yaitu perintah tersebut terbatas hanya bisa memuat equation saja serta tampilannya kurang menarik. Akhirnya kita cari ide lain yaitu dengan "mengakali" mode HTML, dengan inilah postingan beliau yg merupakan ilmu baru buat saya. Pada tulisan beliau tersebut saya rasa sudah dikupas cukup detil dengan lengkap, sementara dengan postingan saya ini hanya menambahkan beberapa variasi (model) bingkai/border saja.
Berikut beberapa variasi bingkai yg saya maksud beserta Kode HTML nya:
1. SOLID
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px solid #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Isi Tulisan di sini</div> 2. DASHED
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px dashed #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Isi Tulisan di sini</div> 3. DOTTED Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px dotted #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Isi Tulisan di sini</div> 4. DOUBLE
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px double #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Tulisan anda di sini</div>5. GROOVE
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px groove #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Tulisan anda di sini</div> 6. OUTSET
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px outset #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Tulisan anda di sini</div> 7. RIDGE
Ketaksamaan Chaucy Schwarz Engel (CS Engel):
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
Untuk sembarang bilangan Real $t_1, t_2, t_3, ..., t_n$ dengan sembarang bilangan real positif $w_1, w_2, w_3, ... , w_n$ berlaku
$$\frac{{t_{1}}^{2}}{w_{1}}+\frac{{t_{2}}^{2}}{w_{2}}+\frac{{t_{3}}^{2}}{w_{3}}+...+\frac{{t_{n}}^{2}}{w_{n}}\leq\frac{(t_1+t_2+t_3+...+t_n)^{2}}{w_1+w_2+w_3+...+w_n}$$
KODE HTML:
<div style="border: 5px ridge #3498DB; background-color:#ECF0F1; padding: 5px; width: 500px;"> Isi Tulisan di sini</div> Cara menggunakan kode HTML border-border di atas sangat mudah, tinggal copy dengan pastekan kode HTML dengan postingan blog kawan-kawan (pada mode HTML/bukan compose) dengan ada beberapa bagian yg bisa kawan-kawan edit sesuai selera, sebagai berikut:
Keterangan (sesuai no di atas) :
1. $5px$ menunjukkan tepal tipisnya bingkai2. #3498DB merupakan warna bingkai dalam kode warna HTML/HEX
3. #ECF0F1 menunjukkan warna latar (backgroud) dengan bingkai ini juga dalam kode warna HTML/HEX
4. $5px$ merupakan jarak tulisan terhadap bingkai
5. $500px$ lebar bingkai
Jika tidak mengetahui kode warna HTML yg diinginkan, kita bisa memanfaatkan HEX genrator online dengan link di bawah ini:
HEX Generator Online Klik Disini
sekian dulu tulisan kali ini. semoga bermanfaat, terimakasih.
Tidak ada komentar:
Posting Komentar