HTML第六章 盒子模型
什么是盒子模型:
(1)边框;
(2)内边距;
(3)外边距;
(4)元素内容·;
(5)背景色·;
边框:
属性:
颜色(border-color),粗细(border-width),样式(border-style)。
border-color属性设置方法:
属性 说明
border-top-color 设置上边框颜色
border-right-color 设置右边框颜色
border-bottom-color 设置下边框颜色
boder-left-color 设置左边框颜色
border-color 设置四个边框为同一种颜色
border-width属性设置方法:
属性 说明
border-top-width 设置上边框粗细
border-right-width 设置右边框粗细
border-bottom-width 设置下边框粗细
border-left-width 设置左边框粗细
border-width 设置四个边框同粗细
border-style属性设置方法:
属性 说明
border-top-style 设置上边框实线
border-right-style 设置右边框实线
border-bottom-style 设置下边框实线
border-left-style 设置左边框实线
border-style 设置四个边框都为实线
外边距:
外边距属性设置方法:
属性 说明
margin-top 设置上外边距
margin-right 设置右外边距
margin-bottom 设置下外边距
margin-left 设置左外边距
margin 设置四个外边距
内边距:
内边距属性设置方法;
属性 说明
padding-left 设置左内边距
padding-right 设置右内边距
padding-top 设置上内边距
padding-bottom 设置下内边距
padding 设置四个内边距
HTML第六章 盒子模型的更多相关文章
- html (第四本书第六章盒子模型参考)
上机1 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8 ...
- (转)iOS Wow体验 - 第六章 - 交互模型与创新的产品概念(2)
本文是<iOS Wow Factor:Apps and UX Design Techniques for iPhone and iPad>第六章译文精选的第二部分,其余章节将陆续放出.上一 ...
- (转)iOS Wow体验 - 第六章 - 交互模型与创新的产品概念(1)
本文是<iOS Wow Factor:Apps and UX Design Techniques for iPhone and iPad>第六章译文精选,其余章节将陆续放出.上一篇:Wow ...
- HTML网页设计基础笔记 • 【第7章 盒子模型】
全部章节 >>>> 本章目录 7.1 盒子模型原理 7.1.1 盒子模型概述 7.1.2 盒子的大小 7.1.3 盒子之间的关系 7.2 标准文档流 7.2.1 标准文档流 ...
- html学习第三天—— 第11章 盒子模型 div
盒模型--边框(一) 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细.样式和颜色(边框三个属性). 如下面代码为div来设置边框粗细为2px.样式为实心的.颜色为红色的边框: div ...
- Ruby on Rails Tutorial 第六章 用户模型
1.用户模型(1)数据库迁移Rails默认使用关系数据库存储数据,数据库中的表有数据行组成,每一行都有相应的列,对应数据属性.把列名命名为相应的名字后,ActiveRecord会自动把他们识别为用户对 ...
- 【CSS学习】--- 盒子模型
一.前言:这篇只作为本人的笔记,以后慢慢再补充. 页面中的所有元素都可以被看作一个一个的“盒子”.这些盒子都包含了:内容(content).内边距(padding).边框(border)以及外边距(m ...
- WEB入门.六 盒子模型
学习内容 CSS盒子模型 盒子之间的关系 页面元素定位 能力目标 理解盒子模型 理解内容与表现分离的优点 理解并掌握盒子之间的关系 理解并掌握绝对定位与相对定位的用法 本章简介 上一章节中已经讲解了页 ...
- 【黑金原创教程】【TimeQuest】【第六章】物理时钟与外部模型
声明:本文为黑金动力社区(http://www.heijin.org)原创教程,如需转载请注明出处,谢谢! 黑金动力社区2013年原创教程连载计划: http://www.cnblogs.com/al ...
随机推荐
- springboot-redis-crda example
springboot-redis-crda example 1. 从 https://github.com/XLuffyStory/springboot-redis-crdu 拿到源码之后,导入到ST ...
- pytest 安装和入门
安装pytest 1.在命令行中运行以下命令: pip install -U pytest 2.检查已经安装的版本: pytest --version This is pytest version 3 ...
- Python 爬虫从入门到进阶之路(十四)
之前的文章我们已经可以根据 re 模块,Xpath 模块和 BeautifulSoup4 模块来爬取网站上我们想要的数据并且存储在本地,但是我们并没有对存储数据的格式有要求,本章我们就来看数据的存储格 ...
- POJ 3680:Intervals(最小费用最大流)***
http://poj.org/problem?id=3680 题意:给出n个区间[Li,Ri],每个区间有一个权值wi,要使得每个点都不被超过k个区间覆盖(最多能被k个区间覆盖),如果选取了第i个区间 ...
- jsp传值
是由a1.jsp发出请求然后由a2.jsp转发给ok.jsp,由ok.jsp响应a1.jsp. 但是这个转发过程是在服务端发生的,客户端不知道所以地址是不变的 转发请求的代码: request.get ...
- async与await详解
async和await只是编译器功能.编译器会用Task类创建代码.如果不适用这两个关键字,也可以用C#4.0和Task类实现同样的功能,只是没有那么方便. 题主在概念上确实混淆的不行,但是确实asy ...
- 安卓学习资料推荐《深入理解Android:卷2》下载
下载地址:百度云下载地址 编辑推荐 <深入理解Android:卷2>编辑推荐:经典畅销书<深入理解Android:卷I>姊妹篇,51CTO移动开发频道和开源中国社区一致鼎力推荐 ...
- asp.net core系列 68 Filter管道过滤器
一.概述 本篇详细了解一下asp.net core filters,filter叫"筛选器"也叫"过滤器",是请求处理管道中的特定阶段之前或之后运行代码.fil ...
- NioEventLoop启动流程源码解析
NioEventLoop的启动时机是在服务端的NioServerSocketChannel中的ServerSocketChannel初始化完成,且注册在NioEventLoop后执行的, 下一步就是去 ...
- spring系列(一):超级经典入门
一 spring是什么 Spring是一个开源框架,它由RodJohnson创建.它是为了解决企业应用开发的复杂性而创建的.Spring使用基本的JavaBean来完成以前只可能由EJB完成的事情. ...