Shulou(Shulou.com)06/01 Report--

This article mainly introduces how CSS uses 1-pixel vacancy to achieve fillet effect, which has a certain reference value, interested friends can refer to, I hope you can learn a lot after reading this article, the following let the editor take you to understand.

The code is as follows:

CSS uses 1 pixel vacancy to achieve fillet-like effect.

Body {padding:20px; font-family:arial; text-align:center;}

P, li {font-size: 12px; line-height:18px;}

H4 {margin-bottom:6px;}

.examplesGoHere {text-align:left; margin:0 auto;}

.letsGiveItAFixedWidthOf200Pixels {width:200px;}

Ul {list-style:none;margin-left:0;padding-left:0;margin-top:0;}

Ul li {margin-bottom:8px; margin-left:0;padding-left:0;}

.notchedListItems a {

Display:block

Border: solid # 666

Border-width: 0 1px

Text-decoration: none

Outline:none

Color: # 000

Background: # e4e4e4

}

.notchedListItems a b {

Display: block

Position:relative

Top:-1px

Left: 0

Border:solid # 666

Border-width:1px 0 0

Font-weight:normal

}

.notchedListItems a b b {

Border-width:0 0 1px

Top: 2px

Padding:1px 6px

}

.notchedListItems a:hover

.notchedListItems a:hover b {background:#666;color:white;}

.feature {

Border:solid # 647aae

Border-width:0 1px

Background:#b0c0e6

}

.feature div {

Position:relative

Top:-1px

Left: 0

Border:solid # 647aae

Border-width:1px 0 0

}

.feature div div {

Top: 2px

Border-width:0 0 1px

Padding: .3em .3em .1em

}

Column example:

Home page of the website

Web page special effects

Software download

DIV area:

Although this program is not complicated, it can be used easily and is simple and practical.

For DELPHI enthusiasts, it has a very convenient report template design.

Can be used by printer, the program uses Access database and ReportBuilder 7.03 control

Run on Delphi 7. 0.

The effect is all right!

Thank you for reading this article carefully. I hope the article "how to use the 1-pixel vacancy of CSS to achieve fillet effect" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.