• 盒模型和圆角


    <!--/*设置盒模型*/-->

    <!--content-box:你设置的width属性值仅仅是内容的宽度,
    盒子的最终的宽高值在width的基础上再加上padding和border的宽度*/-->

    <!--border-box:你设置的width属性值就是盒子的最终的宽度,
    包含了border和padding和内容。如果添加了padding和border,
    那么真正放置内容的区域会减小&#45;&#45;但是它可以稳固页面的结构*/-->

    <!--box-sizing: border-box;-->



    /*添加边框圆角*/
    /*1.设置一个值:四个角的圆角值都一样*/
    /*border-radius: 10px;*/
    /*2.设置两个值:第一个值控制左上/右下,第二个值控制右上/左下*/
    /*border-radius: 10px 30px;*/
    /*3.设置三个值:第一个值控制左上,第二值控制右上/左下,第三个值控制右下*/
    /*border-radius: 10px 40px 60px;*/
    /*4.设置四个值:左上 右上 右下 左下*/
    /*border-radius: 10px 30px 60px 100px;*/

    /*添加/是用来设置当前个不同方向的半径值 水平x方向/垂直y方向*/
    /*border-radius: 100px/50px;*/

    /*添加某个角点的圆角*/
    /*border-radius: 0px 50px 0px 0px;*/
    /*border-上下-左右-radius:*/
    /*border-top-right-radius: 100px;
    border-top-left-radius: 100px;*/
    /*border-bottom-left-radius: 100px;
    border-bottom-right-radius: 100px;*/

    /*设置某个角点的两个方向上的不同圆角*/
    /*border-top-right-radius: 100px 50px;
    border-bottom-left-radius: 80px 40px;
    border-bottom-right-radius: 60px 30px;
    border-top-left-radius: 40px 20px;*/
    /*如果想设置四个角点的不同方向上的不同圆角值*/
    /*分别是水平方向的:左上,右上,右下,左下 / 垂直方向的:左上,右上,右下,左下*/
    border-radius: 100px 0px 0px 0px/20px 0px 0px 0px;
  • 相关阅读:
    关于音视频同步
    redis JedisConnectionException: Could not get a resource from the pool
    ping指定IP的指定端口号
    如何查看端口号是否被占用
    mongodb增删改查基础语法
    mongodb重置密码
    本地MongoDB服务开启与连接本地以及远程服务器MongoDB服务
    MongoDB服务的安装与删除
    可视化
    Elasticsearch下载安装
  • 原文地址:https://www.cnblogs.com/lujieting/p/10145659.html
Copyright © 2020-2023  润新知