CSS盒子模型学习记录1
http://www.blueidea.com/tech/web/2007/4545.asp
代码试验：
html代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="mycss.css">
</head> <body>
<div class="mainBox">
<h3>前言</h3>
<p>正文内容</p>
</div>
<div class="mainBox">
<h3>CSS盒子模式</h3>
<p>正文内容 </p>
</div>
<div class="mainBox">
<h3>转变思想</h3>
<p>正文内容 </p></div>
<div class="mainBox">
<h3>熟悉步骤</h3>
<p>正文内容 </p>
</div>
</body>
</html>
css代码：
@charset "utf-8";
/* CSS Document */
* {margin:0px; padding:0px;}
body {
font-size: 12px;
margin: 0px auto;
height: auto;
width: 805px;
}
.mainBox {
border: 1px dashed #0099aC;
margin: 3px;
padding: 0px;
float: left;
height: 300px;
width: 192px;
}
.mainBox h3 {
float: left;
height: 20px;
width: 179px;
color: #FFFFFF;
padding: 6px 3px 3px 10px;
background-color: #0099CC;
font-size: 16px;
}
.mainBox p {
line-height: 1.5em;
text-indent: 2em;
margin: 35px 5px 5px 5px;
}
运行效果：
盒子模型的各种属性：
内容(content)、填充(padding)、边框(border)、边界(margin)， CSS盒子模式都具备这些属性。
百度百科：
CSS盒子模型学习记录1的更多相关文章
- CSS盒子模型学习记录3（侧面导航栏）
学习http://www.blueidea.com/tech/web/2007/4545_2.asp 代码试验 html <!DOCTYPE html PUBLIC "-//W3C// ...
- CSS盒子模型学习记录2
参考:http://www.blueidea.com/tech/web/2007/4545_2.asp 代码试验: html代码: <!DOCTYPE html PUBLIC "-// ...
- 学习css盒子模型
在这一周,我学习了css,在没有学习css之前,我一直都觉得布局很难,样式特别难调,但是学习了css盒子模型之后我就觉得欸,其实还挺简单的,下面就来看看我学习的css吧. CSS 盒子模型(Box M ...
- 前端学习（十三）：CSS盒子模型
进击のpython ***** 前端学习--CSS盒子模型 在前面的时候也说过,包括分析网页结构的时候,提到了,网页就其实就是一个一个盒子叠起来的 那现在就是有装饰的盒子,难度就变得深刻 所以说为了能 ...
- [CSS3] 学习笔记--CSS盒子模型
1.CSS盒子模型概述 盒子模型的内容范围包括:margin(外边距).border(边框).padding(内边距).content(内容)部分组成. 2.内边距 内边距在content外,bord ...
- 1.26学习总结——css盒子模型
CSS 盒子模型(Box Model) 所有HTML元素可以看作盒子,在CSS中,"box model"这一术语是用来设计和布局时使用. CSS盒模型本质上是一个盒子,封装周围的H ...
- <转>HTML+CSS总结/深入理解CSS盒子模型
原文地址:http://www.chinaz.com/design/2010/1229/151993.shtml 前言:前阵子在做一个项目时,在页面布局方面遇到了一点小问题,于是上stackoverf ...
- 聊聊css盒子模型
css盒子模型原理: 在网页设计中常听的属性名:内容(content).填充/内边距(padding).边框(border).外边距(margin), CSS盒子模式都具备这些属性. 这些属性我们可以 ...
- {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性 定位（position）z-index
前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...
随机推荐
- jsp连接mysql数据库
1.新建一个Java web项目. 2.导入mysql驱动包.(这个跟上一篇写的Java连接mysql类似) 3.编写测试代码 <%@ page contentType="text/h ...
- CSS3实现轮播切换效果
实现轮播的一般思路为在一个大盒子中对无限个元素进行切换操作,大盒子固定大小,超出盒子范围进行隐藏,而里面无限个元素可以任何堆叠,按照一定的步骤进行位置变换,已达到在可视区域呈现我们想要的效果. 看 ...
- Android FM模块学习之四源码分析（3）
接着看FM模块的其他几个次要的类的源码.这样来看FM上层的东西不是太多. 请看android\vendor\qcom\opensource\fm\fmapp2\src\com\caf\fmradio\ ...
- 一个共享内存hash
Background 我们的多进程程序碰到一个需求:做key-value查询,然后拿获取到的value去做一些事情.这些key-value存储在很多词典文件中,数量级>10w,如果每个进程都加载 ...
- dpkg ---- apt-get ------ aptitude 三种方式的区别 及命令格式
转自:http://blog.csdn.net/xiaoyanghuaban/article/details/22946987 dpkg绕过apt包管理数据库对软件包进行操作,所以你用dpkg安装过的 ...
- VB6的函数指针传递
Option Explicit Private Declare Function CallWindowProc Lib "user32" Alias "CallWindo ...
- Sublime Text 3常用快捷键
收集的一些常用快捷键: 选择类 Ctrl+D 选中光标所占的文本,继续操作则会选中下一个相同的文本. Alt+F3 选中文本按下快捷键,即可一次性选择全部的相同文本进行同时编辑.举个栗子:快速选中并更 ...
- Oracle警告、跟踪文件（10046、死锁等跟踪）
跟踪文件由各个后台进程生成,警报日志中记录关键操作包括: ·所有启动和关闭命令,包括中间命令,如alter database mount ·实例的所有内部错误(ORA-600错误,只能 ...
- JSP页面的隐含对象和Servlet程序里的对象之间的关联和区别
首先,有两个概念: 1.JSP页面的域对象:pageContext,request,session,application对象(四个) void setAttribute(String name,Ob ...
- ios crash 日志分析
以下内容来自网络 https://coderwall.com/p/ezdcmg/symbolicating-an-ios-crash-log-without-the-original-dsym-fil ...