• 用CSS制作的圆角层


     1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
     2<html>
     3<head>
     4<title>Nifty Corners: HTML CSS rounded corners</title>
     5<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
     6<meta name="generator" content="HAPedit 3.1">
     7<style type="text/css">
     8body{padding: 20px;background-color: #FFF;
     9font: 100.01% "Trebuchet MS",Verdana,Arial,sans-serif}

    10h1,h2,p{margin: 0 10px}
    11h1{font-size: 250%;color: #FFF}
    12h2{font-size: 200%;color: #f0f0f0}
    13p{padding-bottom:1em}
    14h2{padding-top: 0.3em}
    15div#nifty{ margin: 0 10%;background: #9BD1FA}
    16
    17b.rtop, b.rbottom{display:block;background: #FFF}
    18b.rtop b, b.rbottom b{display:block;height: 1px;
    19overflow: hidden; background: #9BD1FA}

    20b.r1{margin: 0 5px}
    21b.r2{margin: 0 3px}
    22b.r3{margin: 0 2px}
    23b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
    24
    </style>
    25</head>
    26<body>
    27<div id="nifty">
    28<class="rtop"><class="r1"></b><class="r2"></b><class="r3"></b><class="r4"></b></b>
    29<h1>HEADER</h1>
    30<p>CONTENT - 1</p>
    31<h2>HEADER</h2>
    32<p>CONTENT - 2.</p>
    33<class="rbottom"><class="r4"></b><class="r3"></b><class="r2"></b><class="r1"></b></b>
    34</div>
    35</body>
    36</html>
    37
  • 相关阅读:
    今日头条、Face++开发岗面经
    美团offer面经
    成都百度测试开发一二面面经
    美团四面面经
    久邦数码(3G门户)面试
    58 面试
    好未来提前批
    百度提前批
    新浪面经
    Java Programs
  • 原文地址:https://www.cnblogs.com/cnaspnet/p/412659.html
Copyright © 2020-2023  润新知