<style type="text/css">

div{
width:300px;
height:300px;
background:green;
margin:10px;<!--盒子外边距 -->
border:20px solid red;<!-- 盒子的厚度，三元素：宽度，材质，颜色-->
padding:20px;<!-- 盒子内边距，即盒子内容到边框的距离-->
}
#text{
background:green;
}

</style>
</head>
<body>
<div id="test" class="g">
123
</div>

</body>

div盒子模型的更多相关文章

  1. 从div盒子模型谈如何写可维护的css代码（转）

    市面上我们常常会看到各种各样的设计模式书籍,Java设计模式.C#设计模式.Ruby设计模式等等.在众多的语言设计模式中我唯独找不到关于CSS设计模式的资料,即使在网上找到类似内容,细细一看之下才发觉 ...

  2. DIV布局之道二：DIV块的嵌套，DIV盒子模型

    本文讲解DIV块布局的第二种使用方式:嵌套.“DIV嵌套”在有些文献中也被称为“盒子模型”,说的通俗一点就是嵌套(一个大的DIV块内部又包含一个或多个DIV块). 请看如下代码: CSS部分: CSS ...

  3. CSS复合选择器和div盒子模型

    一.复合选择器(3种) 1.交集复合选择器 特点:由2个选择器组成,其中第一个必须是标签选择器,第二个是类或id选择器.两个选择器之间没有空格(有空格属于层级选择器) <h3 class=&qu ...

  4. div盒子模型(一图胜千言)

    offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...

  5. DIV盒子模型介绍 div用法

  6. css盒子模型的宽度不包括margin

    看到教程上和一些博客上盒子模型的宽度 = content + padding + margin + border,应该是不包括margin的 <!DOCTYPE html> <htm ...

  7. html学习第三天—— 第11章 盒子模型 div

    盒模型--边框(一) 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细.样式和颜色(边框三个属性). 如下面代码为div来设置边框粗细为2px.样式为实心的.颜色为红色的边框: div ...

  8. 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍

    01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline   ...

  9. HTML学习笔记 w3sCss盒子模型（阴影）（div的一些使用）案例 第十节 （原创） 参考使用表

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

随机推荐

  1. 10.0.4_对应的相关Windows服务

    对应 VMware Workstation 版本为:“10.0.4 build-2249910” 我的os是Win7 x64. Windows服务: 1. 服务名:VMware NAT Service ...

  2. Js的cookie

    我们现在清除cookie缓存. 然后发起的请求观察: ============== ============= 已经有cookie的情况下发起请求: 我们在看看第一次没有缓存的情况下,返回的数据:

  3. SQL Server中的执行引擎入门

      简介 当查询优化器(Query Optimizer)将T-SQL语句解析后并从执行计划中选择最低消耗的执行计划后,具体的执行就会交由执行引擎(Execution Engine)来进行执行.本文旨在 ...

  4. 04-dotnetCore博客后台基本功能实现

    今天继续上篇博客的内容,在上一篇的时候,已经基本实现了博客列表内容的显示,继续进行添加.编辑.删除等功能.添加和编辑界面共用一个界面,添加界面如图所示: 同样我这里使用的还是layui里面的表单内容, ...

  5. 一位资深php程序员在北京的面试30个题目

    1.SESSION 保存在服务器的哪里?2.服务端是如何获取客户端的cookie?3.如何实现SESSION共享,共享的原理是什么?4.请大致说出LVS搭建的过程,文件共享原理是什么?5.网络共享服务 ...

  6. PCA算法详解——本质上就是投影后使得数据尽可能分散（方差最大），PCA可以被定义为数据在低维线性空间上的正交投影，这个线性空间被称为主⼦空间（principal subspace），使得投影数据的⽅差被最⼤化（Hotelling, 1933），即最大方差理论。

    PCA PCA(Principal Component Analysis,主成分分析)是一种常用的数据分析方法.PCA通过线性变换将原始数据变换为一组各维度线性无关的表示,可用于提取数据的主要特征分量 ...

  7. [转载]Java开发在线打开编辑保存Word文件

    Java调用logo是“P”图标的第三方插件,实现在线编辑保存Word文件(以jsp调用为例,支持SSM.SSH.SpringMVC等流行框架) 工具/原料   Eclipse或MyEclipse等j ...

  8. mysql更改数据文件目录及my.ini位置。

    需求:更改mysql数据数据文件目录及my.ini位置. 步骤: 1.查找my.ini位置,可通过windows服务所对应mysql启动项,查看其对应属性->可执行文件路径,获取my.ini路径 ...

  9. sql server 纵横表的转换

    在平常的工作中或者面试中,我们可能有遇到过数据库的纵横表的转换问题.今天我们就来讨论下. 1.创建表 首先我们来创建一张表. sql语句: --1. 创建数据表 if OBJECT_ID('Score ...

  10. [转]HTMl中Meta标签详解以及meta property=og标签含义

    meta是用来在HTML文档中模拟HTTP协议的响应头报文.META标签是HTML语言HEAD区的一个辅助性标签,它位于HTML文档头部的<HEAD>标记和<TITLE>标记之 ...