zoukankan      html  css  js  c++  java
  • 12.CSS 简单认识margin

    边框

    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;
            }
  • 相关阅读:
    设计模式学习笔记之设计原则
    设计模式学习笔记之生成器模式
    设计模式学习笔记之适配器模式、外观模式
    java中的日期类型之间转换
    JS刷新当前页面的几种方法总结
    Java_枚举
    动态规划详解_2
    Java算法-动态规划详解
    Java经典算法题_2
    Java算法
  • 原文地址:https://www.cnblogs.com/zsdbk/p/9090605.html
Copyright © 2011-2022 走看看