zoukankan      html  css  js  c++  java
  • 11-border(边框)

    边框

    border:边框的意思,描述盒子的边框

    边框有三个要素: 粗细 线性样式 颜色

    border: solid
    

    如果颜色不写,默认是黑色。如果粗细不写,不显示边框。如果只写线性样式,默认的有上下左右 3px的宽度,实体样式,并且黑色的边框。

    按照3要素来写border

    border- 3px;
    border-style: solid;
    border-color: red;
    /*
    border- 5px 10px;
    border-style: solid dotted double dashed;
    border-color: red green yellow;
    */ 

    按照方向划分

    border-top- 10px;
    border-top-color: red;
    border-top-style: solid;
    
    border-right- 10px;
    border-right-color: red;
    border-right-style: solid;
    
    border-bottom- 10px;
    border-bottom-color: red;
    border-bottom-style: solid;
    
    border-left- 10px;
    border-left-color: red;
    border-left-style:solid;
    

    上面12条语句,相当于 bordr: 10px solid red;

    另外还可以这样:

    border-top: 10px solid red;
    border-right: 10px solid red;
    border-bottom: 10px solid red;
    border-left: 10pxb solid red;
    

    border:none;

    border:0;

    表示border没有设置样式。

    使用border来制作小三角

    /*小三角 箭头指向下方*/
            div{
                 0;
                height: 0;
                border-bottom: 20px solid red;
                border-left: 20px solid transparent;
                border-right: 20px solid transparent;
            }
    

      

  • 相关阅读:
    Apache的443端口被占用解决方法
    关于变量初始化问题
    浏览无法加载控件
    关于网络数据传输
    java 对象是在什么时候创建的?
    HTML HTTP
    2020 年计划
    Docker 学习
    [腾讯 TMQ] 接口测试用例设计
    pytest + request
  • 原文地址:https://www.cnblogs.com/liuye1990/p/9478425.html
Copyright © 2011-2022 走看看