• HTML中的边框属性


    可以通过边框风格属性border-style设定上下左右边框的风格,该属性用于设置一个元素边框的样式,而且必须用于指定可见的边框。可以使用1到4个关键字,如果四个值都给出了,它们分别用于上、右、下和左边框的样式

    如果给出一个值,它将被运用到各边上。

    如果两个或三个值给出了,省略了的值与对边相等

    也可以分别使用border-top-style、border-bottom-style、border-left-style、border-right-style属性单独设置各边的风格


    各边的风格使用的属性值
    none:没有边框,无论边框宽度设置为多大
    dotted:点线式边框
    dashed:破折线式边框
    solid:直线式边框
    double:双线式边框
    groove:槽线式边框
    ridge:脊线式边框
    inset:内嵌效果的边框
    outset:突起效果的边框

     1 <!--
     2 可以通过边框风格属性border-style设定上下左右边框的风格,该属性用于设置一个元素边框的样式,而且必须用于指定可见的边框。可以使用1到4个关键字,如果四个值都给出了,它们分别用于上、右、下和左边框的样式
     3 
     4 如果给出一个值,它将被运用到各边上。
     5 
     6 如果两个或三个值给出了,省略了的值与对边相等
     7 
     8 也可以分别使用border-top-style、border-bottom-style、border-left-style、border-right-style属性单独设置各边的风格
     9 
    10 
    11 各边的风格使用的属性值
    12 none:没有边框,无论边框宽度设置为多大
    13 dotted:点线式边框
    14 dashed:破折线式边框
    15 solid:直线式边框
    16 double:双线式边框
    17 groove:槽线式边框
    18 ridge:脊线式边框
    19 inset:内嵌效果的边框
    20 outset:突起效果的边框
    21 -->
    22 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    23 <html xmlns="http://www.w3.org/1999/xhtml">
    24 <head>
    25 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    26 <title>边框风格属性</title>
    27 <style>
    28     h1{
    29         border-style:solid;
    30         border-width:10px 20px 30px 40px;
    31         border-color:red blue yellow green;
    32     }
    33     h2{
    34         border-style:double solid inset dotted;
    35     }
    36     h3{
    37         border-top-style:solid;
    38         border-bottom-style:outset;
    39     }
    40 </style>
    41 </head>
    42 
    43 <body>
    44     <h1>wwwwwwwwwwwwwwwww</h1>
    45     <h2>wwwwwwwwwwwwwwwww</h2>
    46     <h3>wwwwwwwwwwwwwwwww</h3>
    47 </body>
    48 </html>
  • 相关阅读:
    cf B. Sonya and Exhibition
    cf B. Sonya and Exhibition
    1000C
    1000C
    AOE网打印所有的关键路径
    AOE网打印所有的关键路径
    拓扑排序判断有向图是否成环
    拓扑排序判断有向图是否成环
    迭代器
    Dictionary Aizu
  • 原文地址:https://www.cnblogs.com/Y-HKL/p/5244969.html
Copyright © 2020-2023  润新知