border :(边框);

  其实现在的border是三个属性合成的,

      border-width:边框大小;

      border-style:边框的样式;

      border-color:边框的颜色;

  合成以后的用法更方便,如下:

       border:size pattenr color; size:边框大小,如1px;pattenr:线条模式,solid实心线条; color:边框颜色,如red红色;

  可以不按顺序写,就算其中有项不写,也不影响输出,都有自己的默认样式;

  border-style,用于设置元素所有边框的样式,或者单独地为各边设置边框样式。只有当这个值不是 none 时边框才可能出现。

例子如下:

border-style:dotted solid double dashed;

  上边框是点状,右边框是实线,下边框是双线,左边框是虚线;

  盒模型的四个属性:


  Content(内容含width,height)-padding(填充/内边距)—border(边框)—margin(边距/外边距)—Border边框(影响实际宽高)

  box-sizing: border-box;属性把边框设置成盒子的内边框
 

css边框普通属性的更多相关文章

  1. 利用CSS边框合并属性打造table细边框

    CSS代码: <style> table{ border-collapse: collapse;/* 边框合并属性 */ width:200px; } th{ border: 1px so ...

  2. CSS的背景属性和边框属性

    CSS的背景属性: background 简写属性,作用是将背景属性设置在一个声明中 background-attachment 背景图像是否固定或者随着页面的其余部分滚动 background-co ...

  3. 复习-css边框和背景属性

    css边框和背景属性 border:所有边框属性 border-width:四条边框的宽度 border-style:设置边框样式,主要有dotted.solid.double border-colo ...

  4. CSS .css边框属性(border)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. HTML&CSS基础-边框简写属性

    HTML&CSS基础-边框简写属性 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> ...

  6. 理解CSS边框border

    前面的话   边框是CSS盒模型属性中默默无闻的一个普通属性,CSS3的到来,但得边框属性重新焕发了光彩.本文将详细介绍CSS边框 基础样式   边框是一条以空格分隔的集合样式,包括边框粗细(边框宽度 ...

  7. CSS中box-sizing属性的理解与部分用法

    今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...

  8. 第 17 章 CSS 边框与背景[下]

    学习要点: 1.设置背景 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 边框和背景,通过边框和背景的样式设置,给元素增加更丰富的外观. 一.设置背景 盒模型的尺寸可以通过两种方式实现可见性, ...

  9. 第 17 章 CSS 边框与背景[上]

    学习要点: 1.声明边框 2.边框样式 3.圆角边框 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 边框和背景,通过边框和背景的样式设置,给元素增加更丰富的外观. 一.声明边框 边框的声明有 ...

随机推荐

  1. React之react-router(connected-react-router/react-router-dom)

    文档: react-router-dom官方文档:https://reacttraining.com/react-router/web/guides/quick-start connected-rea ...

  2. 设置程序启动时加载的storyboard

    这个设置表明:程序启动时会加载Main.storyboard

  3. Linux防火墙(iptables/firewalld)

    Linux防火墙(iptables/firewalld) 目录 Linux防火墙(iptables/firewalld) 一.iptables 1. iptables概述 2. netfilter和i ...

  4. [01-jwt]C# JWT基础知识详解

    本篇文章将介绍jwt基础概念性知识,不含实操代码展示,特别适合该方面知识空白的人群,大神级别请选择性观看.不喜禁喷,出门右转,谢谢配合. 一.什么是JWT? JWT是简写,全称是JSON Web To ...

  5. requests实现接口测试

    python+requests实现接口测试 - get与post请求基本使用方法 http://www.cnblogs.com/nizhihong/p/6567928.html   Requests ...

  6. 虫师Selenium2+Python_11、自动化测试项目实战

    P276 11.1.3 自动化测试用例编写原则 在编写自动化测试用例过程中应该遵循以下原则: 1.一个用例为一个完整的场景,从用户登录系统到最终退出并关闭浏览器: 2.一个用例只能验证一个功能点,不要 ...

  7. SpringMVC 解析(三) Controller 注解

    我在前面的文章中介绍了Spring MVC最核心的组件DispatcherServlet,DispatcherServlet把Servlet容器(如Tomcat)中的请求和Spring中的组件联系到一 ...

  8. 框架5--nginx安装部署 上(web服务)

    目录 框架5--nginx安装部署(web服务) 1.练习 2.昨日问题 3.今日内容 4.什么是web服务 5.web服务器软件 6.部署Nginx 7.平滑增加Nginx模块 8.Nginx的命令 ...

  9. Solution -「UOJ #450」复读机

    \(\mathcal{Description}\)   Link.   求从 \(m\) 种颜色,每种颜色无限多的小球里选 \(n\) 个构成排列,使得每种颜色出现次数为 \(d\) 的倍数的排列方案 ...

  10. 痞子衡嵌入式:对比MbedTLS算法库纯软件实现与i.MXRT上DCP,CAAM硬件加速器实现性能差异

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是MbedTLS算法库纯软件实现与i.MXRT上DCP,CAAM硬件加速器实现性能差异. 近期有 i.MXRT 客户在集成 OTA SBL ...