zoukankan      html  css  js  c++  java
  • 盒子模型

    一.边框
     
     1.边框颜色  
      border-color 边框颜色(可以设置上边框,如:border-top-color,也可以整体设置,但是要注意顺序)
      
     2.边框粗细  
      border-width 边框粗细(可以设置上边框,如:border-top-width,也可以整体设置,但是要注意顺序)
      
     2.边框样式  
      border-style 边框样式(可以设置上边框,如:border-top-style,也可以整体设置,但是要注意顺序)
      
    二.外边距
     1.margin   盒子距离浏览器的距离  (可以设置上外边距,如:margin-top,也可以整体设置,但是要注意顺序)
     
     2.居中 margin: 0px auto
    三.内边距 
     1.padding   内容到盒子的距离  (可以设置上内边距,如:padding-top,也可以整体设置,但是要注意顺序)
     
    四.盒子模型的尺寸
     
     尺寸默认:padding+margin+wigth+border
     
     box-sizing 方便计算盒子模型尺寸(默认为content-box,border-box代表随着内容的宽度高度变化而变化)
    五.圆角
     
     border-radius 圆角(左上,右上,右下,左下)
     /*如果想要一个圆,那么必须满足宽和高一致,圆角取宽度或者高度的二分之一*/
     /*如果想要半圆,那么必须满足宽是高的2倍,圆角取宽度的二分之一*/
     /*如果想要四分之一圆,那么必须满足宽和高相等,圆角取宽度相等值*/
     
    六.盒子阴影
     box-shadow 默认为外阴影,内阴影为inset
     box-shadow: 5px -5px 20px black;
  • 相关阅读:
    8.图形软件开发
    7.GDI绘图技术
    15.MFC网络通信
    JavaWeb:基于MVC设计模式的一个小案例(一)
    在虚拟机里连接PLC S7-200
    mark-又重新回到博客园
    早起的奇迹
    STM32-cJSON库的打包和解析
    Copley-STM32串口+CANopen实现双电机力矩同步
    DataStructure-链表实现指数非递减一元多项式的求和
  • 原文地址:https://www.cnblogs.com/cw172/p/9903782.html
Copyright © 2011-2022 走看看