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. mpfu 位编辑处理?

    1.  国内的不用处理,其余都做 2.  判断是否是mp   的项目 3  设置位数编辑    请求中    和  检查中都要做 4  以某一画面作为基准,修改不同的值. 5  对象外的数据直接设置在 ...

  2. Windows 是最安全的操作系统

    建了一个用户交流群,我在群里说:"Windows 是最安全的操作系统." 立刻引发了很多有意思的观点.我在群里一个人说不过大家,先篇文章把自己的论点罗列一下. 对操作系统攻击的方式 ...

  3. 「BalkanOI 2018 Day1」Election

    「BalkanOI 2018 Day1」Election 记C为1,T为-1,\(sum[i]\)为\(i\)点的前缀和. 对于询问\([l,r]\),分两步计算答案. 要求所有点的\(sum[i]- ...

  4. [学习笔记]Linux环境下部署 .Net5 程序

    ​公司的项目需要部署到一台公网的linux服务器,以便同事们测试小程序. 目标服务器是新搭建的CentOS 8虚拟机,以非docker的方式部署.现记录过程便于日后部署至项目甲方的服务器上,因为甲方的 ...

  5. echarts图表的封装

    其实echarts官网有个快速上手的教程,一般人看一遍也知道是怎么回事,先给个传送门吧--五分钟上手 引入方式多种多样就自己去官网看了--这里简单介绍echarts怎么用,下方的封装函数比较重要 1. ...

  6. C++ XML解析之TinyXML

    转载请注明来源:https://www.cnblogs.com/hookjc/ 使用TinyXML进行C++ XML解析,感觉使用起来比较简单,很容易上手,本文给出一个使用TinyXML进行XML解析 ...

  7. 快速搭建ELK7.5版本的日志分析系统--搭建篇

    title: 快速搭建ELK7.5版本的日志分析系统--搭建篇 一.ELK安装部署 官网地址:https://www.elastic.co/cn/ 官网权威指南:https://www.elastic ...

  8. Hadoop启动错误——ERROR: Attempting to operate on hdfs namenode as root but there is no HDFS_NAMENODE_USER defined. Aborting operation.

    错误如下所示; [root@localhost sbin]# start-all.sh Starting namenodes on [192.168.71.129] ERROR: Attempting ...

  9. linux_4

    自建yum仓库,分别为网络源和本地源 编译安装http2.4 linux命令练习 列出ubuntu软件管理工具apt的一些用法(自由总结)

  10. springBoot-启动原理

    注:SpringBoot版本 2.6.2 SpringBoot的入口是从SpringApplication.run()传入我们的主启动类开始 @SpringBootApplication public ...