Untuk memunculkan bingkai dalam html, sobat bisa menggunakan properti border, untuk mengatur bingkai secara keseluruhan. Sedangkan properti border-left, border-right, border-top dan border-bottom, digunakan untuk menentukan bagian – bagian tertentu dalam bingkai.
border-left, digunakan untuk menentukan bagian kiri bingkai.
border-right, digunakan untuk menentukan bagian kanan bingkai.
border-top, digunakan untuk menentukan bagian atas bingkai.
border-bottom, digunakan untuk menentukan bagian bawah bingkai.
Properti seperti di atas bisa diisi dengan nilai sebagai berikut :
Border: 2px solid #00F;
- 2px berarti ukuran ketebalan bingkai.
- Solid artinya jenis bingkai yang dipilih adalah solid.
- #00F adalah warna bingkai dalam hal ini berwarna biru.
Sekarang siapkan notepad atau software pembuat website (adobe dreamweaver) sobat.
Dari sini sobat sudah ada bayangan bagaimana border bekerja.
Sekarang, Bagaimana menentukan jenis bingkai?
Berikut adalah nama dan bentuk jenis bingkai yang bisa digunakan.
Bagaimana membuat tombol dengan properti border?
Coba sobat praktekkan kode berikut :
Hasilnya seperti ini :<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Contoh Pengaturan Border oleh Ketikweb</title>
<style type="text/css">
.tombol{
border-bottom:4px solid #CF0;
border-left:4px solid #CF0;
border-right:4px solid #CF0;
border-top:4px solid #CF0;
width:100px;
text-align:center;
background-color:#0C0;
color:#FFF;}
</style>
</head>
<body>
<p class="tombol">Klik Saya !</p>
</body>
</html>
- width:100px artinya lebar tombol sebesar 100pixel.
- Text-align:center artinya teks ditempatkan rata tengah.
- background-color:#0C0 artinya warna latar belakang tombol berwarna #0C0(hijau)
- color:#FFF artinya teks berwarna #FFF(putih).
Mudahkan? Silahkan sobat bereksperimen lagi dengan pengetahuan baru sobat ini dengan menggunakan properti border. Sekian dulu dari saya, semoga bermanfaat. Wassalam... Ketikweb.blogspot.com
|
Share ke Google
|
"Sobat suka postingan ini? Silahkan copy link dibawah ini dan paste ke web, blog, atau sosial media sobat yang nantinya akan menghubungkan sobat langsung dengan postingan ini. "
|
| Untuk mendapat respon balik dari saya, tuliskan identitas sobat dalam memberi komentar dalam kolom dibawah ini. |
43 comments:
Great information. Lucky me I found your blog by accident (stumbleupon).
I have saved it for later!
Feel free to visit my page :: website
Also see my web site - razor e300 electric scooter
Hmm it seems like your website ate my first comment
(it was super long) so I guess I'll just sum it up what I submitted and say, I'm thoroughly enjoying your blog.
I too am an aspiring blog writer but I'm still new to the whole thing. Do you have any recommendations for newbie blog writers? I'd genuinely appreciate it.
Feel free to surf to my page; Cecile Summer
It's in point of fact a great and useful piece of information. I'm satisfied that
you simply shared this useful info with us. Please keep
us informed like this. Thank you for sharing.
Check out my site Raul randal
Excellent, what a website it is! This webpage provides useful data to
us, keep it up.
Feel free to surf to my blog post: vitamin Supplement
My website :: Vitamine B6
I was recommended this blog through my cousin. I am not certain whether or
not this submit is written by means of him as nobody else realize such distinctive approximately my trouble.
You're amazing! Thanks!
Visit my web site ... custom alloy wheels
What's up, I wish for to subscribe for this webpage to take most recent updates, therefore where can i do it please assist.
my web page ... magnets 4 energy scam
Hi, I want to subscribe for this web site to get newest updates, thus
where can i do it please assist.
Feel free to surf to my blog - spode dinnerware
Awesome things here. I am very happy to peer your article.
Thank you a lot and I'm having a look forward to contact you. Will you please drop me a mail?
Here is my page :: gaming keyboards
thanks for all of your appreciation, to discuss with me... you can contact me on heroscoop.com my account name (cilbut), add me as your hero... n i will tell you my update information..
I always emailed this blog post page to all my associates,
because if like to read it afterward my links will too.
Visit my web-site external doors
Tremendous issues here. I am very satisfied to see your post.
Thanks so much and I am taking a look forward to touch you.
Will you please drop me a e-mail?
Here is my website: offers a maximum water pressure
Great post.
my weblog ... nike shox shoes
need my email? need my update? just sign up in heroscoop.com, and add me as your hero (find me first my account name cilbut)... i will tell u my update, you can read my another article in there.. you can chat with me if i am ready online.
I got this website from my pal who shared with me regarding
this web site and now this time I am visiting this web site and reading very informative
content here.
My web blog - linksys gigabit router
I got this website from my pal who shared with me
regarding this web site and now this time I am visiting this web site and reading very informative content
here.
Also visit my blog - linksys gigabit router
Appreciate this post. Will try it out.
my web blog ... Rogelio Marina
It's the best time to make some plans for the future and it is time to be happy. I've
read this put up and if I may just I wish to suggest you few attention-grabbing issues or tips.
Maybe you can write subsequent articles referring to this article.
I want to learn even more things about it!
my blog; casio electronic keyboards
Hi colleagues, good article and good urging commented at this place,
I am actually enjoying by these.
Review my website ... insulated sidewall pants
Hello there! This post couldn't be written much better! Looking through this post reminds me of my previous roommate! He always kept talking about this. I most certainly will send this information to him. Fairly certain he's going to
have a great read. Many thanks for sharing!
Look into my site; regression therapy
Simply want to say your article is as astonishing.
The clarity in your post is simply great and i could assume you're an expert on this subject. Well with your permission allow me to grab your feed to keep up to date with forthcoming post. Thanks a million and please keep up the rewarding work.
Feel free to surf to my web page; magnets 4 energy review
Appreciate this post. Will try it out.
My web site: septic systems
This design is wicked! You most certainly know how to keep a reader amused.
Between your wit and your videos, I was almost moved to
start my own blog (well, almost...HaHa!) Wonderful job. I really enjoyed what you
had to say, and more than that, how you presented it.
Too cool!
Feel free to visit my web blog :: weight loss programs
Hi, I wish for to subscribe for this web site to take most recent updates,
so where can i do it please assist.
Feel free to surf to my website home generators
Fastidious answers in return of this query with genuine arguments and explaining everything on
the topic of that.
my blog post ... hair texture
I think the admin of this website is in fact working
hard for his website, because here every information is quality based
data.
Also visit my page - neodymium rare earth magnets
Just want to say your article is as surprising.
The clearness in your post is just spectacular and i could assume you're an expert on this subject. Well with your permission allow me to grab your RSS feed to keep up to date with forthcoming post. Thanks a million and please keep up the rewarding work.
Feel free to visit my site ... nitrogen generators
Hello, yeah this piece of writing is in fact fastidious and
I have learned lot of things from it concerning blogging.
thanks.
Also visit my web page ... cruise line Employment
Generally I don't read article on blogs, but I wish to say that this write-up very forced me to check out and do it! Your writing taste has been amazed me. Thanks, very nice post.
My web blog :: oak doors
It's very straightforward to find out any topic on net as compared to books, as I found this paragraph at this website.
my blog ... american buffalo gold proof coins
If some one wants expert view concerning blogging and
site-building afterward i suggest him/her to visit this weblog, Keep
up the fastidious work.
My weblog - kettlebell exercise
I could not refrain from commenting. Exceptionally well written!
Check out my website non espresso
Cool blog! Is your theme custom made or did you download it
from somewhere? A design like yours with a few
simple adjustements would really make my blog stand out.
Please let me know where you got your theme. Kudos
Take a look at my webpage - chosing flooring
Link exchange is nothing else except it is just placing the other person's web site link on your page at proper place and other person will also do same in support of you.
Here is my site ... car cleaning
Thanks for finally talking about > "Membuat Bingkai dan Tombol Dengan CSS" < Loved it!
Also visit my web page :: wine chillers
This is the right web site for anyone who would like to find
out about this topic. You understand a whole lot its almost tough to argue with you (not
that I personally will need to…HaHa). You definitely put a new spin on a subject which has been written about for ages.
Excellent stuff, just excellent!
Feel free to surf to my web-site ... cancun resorts all inclusive
Hi, Neat post. There's a problem together with your site in internet explorer, may check this? IE still is the market chief and a huge portion of people will omit your fantastic writing due to this problem.
my web page disabled stranded cruise ships
actually, if you need my replay please write down your identity on your comment. (i dont know anonymous)
It's going to be ending of mine day, but before ending I am reading this great post to increase my knowledge.
Also visit my site :: carnival cruise lines
Hello, i think that i saw you visited my web site so i came to “return the favor”.
I'm trying to find things to enhance my website!I suppose its ok to use some of your ideas!!
Also visit my website - sell wine
Hi there to every body, it's my first pay a quick visit of this website; this website consists of amazing and really good material designed for readers.
my web page; kettlebell swing
Greetings! I've been following your site for a long time now and finally got the courage to go ahead and give you a shout out from Porter Tx! Just wanted to mention keep up the excellent job!
Feel free to visit my web-site - kettlebell cross training
It's actually a great and helpful piece of info. I am glad that you simply shared this helpful information with us. Please stay us informed like this. Thank you for sharing.
My web blog: Ruth Holley
Great delivery. Sound arguments. Keep up the good work.
Visit my web blog :: non-leather handbags
Post a Comment