Tạo góc cho khung (bằng Image) 2007-09-18 01:53:52

Bài này không có gì đặc biệt chủ yếu là để tham khảo.<br />
Demo:
<style type="text/css">
.curlycontainer{
border: 1px solid #b8b8b8;
margin-bottom: 1em;
width: 300px;
}

.curlycontainer .innerdiv{
background: transparent url(http://phpbasic.com/phpbasic_data/include/brcorner.gif) bottom right no-repeat;
position: relative;
left: 2px;
top: 2px;
padding: 1px 4px 15px 5px;
}

</style>
<div class="curlycontainer">
<div class="innerdiv">
<b>Some title</b> <br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here.
</div>
</div>



<style type="text/css">
.curlycontainer{
border: 1px solid #b8b8b8;
margin-bottom: 1em;
width: 300px;
}

.curlycontainer .innerdiv{
background: transparent url(http://phpbasic.com/phpbasic_data/include/brcorner.gif) bottom right no-repeat;
position: relative;
left: 2px;
top: 2px;
padding: 1px 4px 15px 5px;
}

</style>
<div class="curlycontainer">
<div class="innerdiv">
<b>Some title</b> <br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here. Some text here.<br />
Some text here.Some text here.
</div>
</div>

Tra loi 3 comment(s) TG 2007-09-18 01:53:52

TK 2007-09-18 01:42:35

^_^ TK lười viết, ngày xưa tạo bằng Table vất vả hơn CSS nhìu, nhưng bi giờ dùng CSS nhìu cũng quen.

Tra loi

TmE 2008-09-22 10:26:20

Ví dụ mình có 4 cái khung đó đặt liền kề nhau và chia thành 2 hàng và 2 cột
Thì có một điều xẩy ra đó là border phía bên trái và bên phải; phía trên và phía dưới sẽ trùng nhau và tô đậm lên làm xấu những chổ tiếp xúc này

Vậy có cách nào khắc phục không?

Tra loi

TG 2008-09-22 12:33:23

Bạn thay thuộc tính border thành border-left, border-right, border-top, border-bottom, ở những chỗ tiết xúc thì đặt border tương ứng là 0

Tra loi

Y kien