Cara-Membuat-Garis-Tepi-Pada-Posting-Blog
 Cara buat Garis Tepi di Posting Blog.

Berikut Cara Membuat Garis tepi di Postingan Blog atau  kalimat tertentu pada blog. Kami sendiri juga hasil kopas dari blog tetangga, serta mencoba untuk menyimpannya di blog ini, dan mencoba untuk berbagi pada sesama blogger newbi seperti kami..

Mungkin yang saudara harapkan adalah seperti di atas, ? Kalau toh memang sedemikian yang di idamkan saudara, silahkan kopi kode berikut

<div style="border: 1px solid rgb(0, 0, 0); padding: 4px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">
Isilah postingan atau tulisan saudara yang mau diberi garis tepi

</div>

Atau sobat menginginkan garis tepi pada contoh di bawah ini, ?


Kalau tertarik jua, silahkan kopas kode di bawah ;

  <textarea cols="60" rows="6">seperti biasanya. Tulisan saudara disini</textarea>

Perbedaan dari dua garis tepi di atas sangat bisa dirasakan. Kalau lebar, tinggi pada garis tepi yang no pertama akan menyesuaikan banyak atau sedikitnya tulisan saudara. Tapi kebalikannya dengan garis tepi yang ke dua. Lebar kolom tetap seperti itu sesuai lebar yang saudara hendaki, namun ketika tulisan sobat sangat dan sangat banyak, lebar kolomnya tetap seperti semula akan tetapi sangat keren karena tulisan saudara berada di dalamnya tanpa terbuang sedikit pun. Dan kelebihan yaitu pembaca bisa langsung edit tulisan di dalam garis tepi tersebut.

Kegunaannya Garis Tepi Untuk Kalimat Tertentu Pada Blog.

Sebenarnya tidak perlu kami tuliskan secara mendalam tentang kegunaan garis tepi ini. Sow pasti sudah tahun apa kegunaannya, dan apa tujuannya membuat garis tepi. Walaupun saudara sudah tahu, biarkan kami selaku pengelola blog sederhana ini untuk saling berbagi apa ya telah dikaruniai Allah Subhanahu Wa taala.
Perbedaan antara kegunaan dan tujuan pemasangan garis tepi, sebenarnya tidak terlalu beda banget. Karena tujuan saudara membuat garis tepi, adalah kegunaan garis tepi. Dan adanya kegunaan garis tepi, itu karena ada tujuan pembuatan garis tepi. Hehehe.. pastinya saudara sudah tahu maksud di atas.

Sedemikianlah kode garis tepi untuk tulisan blog tertentu, yang kami koleksi. Atau Garis tepi seperti ini yang saudara impi impikan ?

Tambahan Garis Tepi Pada Blog.



   /* CSS Syntax Highlighter */
pre{-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;padding:0;margin:.5em auto;white-space:pre;word-wrap:break-word;overflow:auto;background-color:#443e50;position:relative;padding-top:33px;width:100%;-moz-tab-size:2;-o-tab-size:2;tab-size:2;word-break:normal;-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;border-radius:3px;}
pre::-webkit-scrollbar,pre::-moz-scrollbar,pre code::-webkit-scrollbar,pre code::-moz-scrollbar,code::-webkit-scrollbar,code::-moz-scrollbar {display:none;}
pre::before{font-size:15px;font-weight:700;content:attr(title);position:absolute;top:0;padding:9px 0;left:0;right:0;color:#79798d;display:block;margin:0;text-indent:15px}
pre:after{display:inline-block;content:"\f121";font-family:fontAwesome;font-style:normal;font-weight:normal;font-size:18px;color:#79798d;top:0;right:0;padding:9px 14px;position:absolute}
pre code{display:block;background:none;border:none;color:#bec3ce;padding:25px 20px 20px 20px;font-family:'Source Code Pro',Open Sans Condensed,Consolas,Monaco,monospace;font-size:.83rem;white-space:pre;overflow:auto}
code .token.important {font-weight:bold;}
code .token.entity {cursor:help;}
pre mark,code mark,pre code mark {background-color:#3498db!important;color:#fff!important;padding:2px;margin:0 2px;border-radius:2px;}
pre[data-codetype="CSSku"]:before,pre[data-codetype="HTMLku"]:before,
pre[data-codetype="JavaScriptku"]:before,pre[data-codetype="JQueryku"]:before{background-color:#fff;box-shadow:inset 0 0 0 1px #eee;} 
Kalau saudara juga jatuh hati pada garis tepi pada urutan ketiga ini, silahkan kopas kode di atas, dan pastekan pada template blog, kemudian letakkan di jajaran kode css lainnya. Atau bisa juga letakkan di atas kode </head>. Langkah selanjutnya adalah letakkan kode berikut pada postingan blog saudara ;

<pre data-codetype="CSSku" title="CSS"><code class="language-markup">Letakkan kata atau kodenya saudara pas tepat di sini</code></pre>

Garis tepi ini adalah karya mb arlina.

UPDATE GARIS TEPI PADA POSTINGAN BLOG.

Garis Tepi Bernama dotted.

<p style="border: 3px dotted; #000000; padding: 20px; align: center;"> isinya disini.</p>

Garis Tepi Postingan Blog Bernama Double

<p style="border: 5px double; #000000;padding: 20px;"> Allahu Akbar.</p>

Cara Blog Berkomentar Pada Wordpres. Untuk Dapatkan Backlink.

Garis tepi Bernama grove

<p style="border: 10px groove; #000000; padding: 20px;">cara membuat tombol demo dan download </p>

Garis Tepi Bernama ridge

<p style="border: 10px ridge; #000000; padding: 20px;"> Ngopi Ngopiiiiii.</p>

Garis Tepi Bernama inset

<p style="border: 10px inset; #000000; padding: 20px;"> Hujan dan Atis</p>

Kalau yang terakhir ini bernama outset

<p style="border: 10px outset; #FF3300; padding: 20px;"> Alhamdulillah sudah kelar.</p>

waaaaaaaawwwww... keren banget kaaaan ?
0 Komentar untuk "Cara Membuat Garis Tepi di Postingan Blog /sederhana"

Terima Kritik dan Saran..tapi ingat, jangan spam yeah ?
Terimakasih