知识点:

  1.在元素周围添加边距的方法

  2.在元素中添加填充的方法

  3.对齐的方法

  4.float属性的使用

这里提到了CSS禅意花园,这块有时间可以玩玩~

margin和padding:用于添加元素周围的间距

14.1 使用边距

  margin是边距

  参数可以有【1~4】4种类型

14.2 填充元素

  padding用于填充border与内容之间的空间

  参数与margin一致

14.3 保持对齐

  align,对齐: 有text-align,vertical-align

  使用值根据自己的需求再自行研究。

14.4 理解Float属性

  <p>段落在float元素里面可以做到环绕效果。  

HTML与CSS入门——第十四章  使用边距、填充、对齐和浮动的更多相关文章

  1. HTML与CSS入门——第十二章  在网页中使用多媒体

    知识点: 1.如何链接多媒体文件 2.如何嵌入多媒体文件 3.使用多媒体的更多技巧 多媒体文件:音频,视频和动画,以及静态的图像和文本. 这里我就直接讲HTML5了…… 此前都是用ojbect来加载或 ...

  2. 无废话ExtJs 入门教程十四[文本编辑器:Editor]

    无废话ExtJs 入门教程十四[文本编辑器:Editor] extjs技术交流,欢迎加群(201926085) ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要. 但有时候这个功 ...

  3. CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章

    第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮 ...

  4. Bootstrap入门(十四)组件8:媒体对象

    Bootstrap入门(十四)组件8:媒体对象 这是一个抽象的样式,用以构建不同类型的组件,这些组件都具有在文本内容的左或右侧对齐的图片(就像博客评论或 Twitter 消息等). 1.基本样式 2. ...

  5. Gradle 1.12用户指南翻译——第三十四章. JaCoCo 插件

    本文由CSDN博客万一博主翻译,其他章节的翻译请参见: http://blog.csdn.net/column/details/gradle-translation.html 翻译项目请关注Githu ...

  6. HTML第十四章总结 HTML forms

    第十四章主要讲了 html forms,通过 forms,我们可以得到 customers' feedback,使得网页能够 interactive,本章的内容分为三个部分: forms 的 elem ...

  7. 【odoo14】第十四章、CMS网站开发

    第十四章.CMS网站开发** Odoo有一个功能齐全的内容管理系统(CMS).通过拖放功能,你的最终用户可以在几分钟内设计一个页面,但是在Odoo CMS中开发一个新功能或构建块就不是那么简单了.在本 ...

  8. 《Linux命令行与shell脚本编程大全》 第十四章 学习笔记

    第十四章:呈现数据 理解输入与输出 标准文件描述符 文件描述符 缩写 描述 0 STDIN 标准输入 1 STDOUT 标准输出 2 STDERR 标准错误 1.STDIN 代表标准输入.对于终端界面 ...

  9. perl 第十四章 Perl5的包和模块

    第十四章 Perl5的包和模块 by flamephoenix 一.require函数  1.require函数和子程序库  2.用require指定Perl版本二.包  1.包的定义  2.在包间切 ...

随机推荐

  1. Android-为何以及如何保存Fragment实例

    在安卓开发中,由于旋转设备会造成配置改变进而导致Activity实例被摧毁(当然也包括Activity托管的Fragment).Activity或Fragment实例被摧毁自然也就让Model被摧毁, ...

  2. javascript 获取图片原始尺寸

    javascript 获取图片原始尺寸 function getImgInfo(url){ var img = new Image(), loaded = false; var info = {}; ...

  3. hdu5353

    模拟,,, 每个人有一些糖果,每两个人之间只能给一个糖果,问最后是否能让所有人的糖果数量相同,只要确定一个糖果的流向其他的就能够确定. 马虎了,卡了好几天,心塞塞的... #include<io ...

  4. uva 846 - Steps

    找出步數與距離的關係即可得解. 0步最多能抵達的距離是0 1步最多能抵達的距離是1(1) 2步最多能抵達的距離是2(1 1) 3步最多能抵達的距離是4(1 2 1) 4步最多能抵達的距離是6(1 2 ...

  5. H5原生拖拽事件

    使用原生js实现简单的拖拽事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  6. Heroku使用

    先要生成一个公钥,使用命令:$ ssh-keygen -t rsaGenerating public/private rsa key pair.Enter file in which to save ...

  7. Java系列--第六篇 基于Maven的SSME之多国语言实现

    如果你的网站足够强大,以致冲出了国门,走向了国际的话,你就需要考虑做多国语言了,不过,未雨绸缪,向来是我辈程序人员的优秀品质,谁知道那天,我们的网站被国外大公司看中收购,从而飞上枝头变凤凰.不扯这么多 ...

  8. Zepto源码笔记(一)

    最近在研究Zepto的源码,这是第一篇分析,欢迎大家继续关注,第一次写源码笔记,希望大家多指点指点,第一篇文章由于首次分析原因不会有太多干货,希望后面的文章能成为各位大大心目中的干货. Zepto是一 ...

  9. 汉诺塔问题C++实现

    大家好,我是小鸭酱,博客地址为:http://www.cnblogs.com/xiaoyajiang 以下进行汉诺塔问题的递归实现 #include <iostream.h> int gb ...

  10. matlab的绘图保存

      matlab的绘图和可视化能力是不用多说的,可以说在业内是家喻户晓的.Matlab提供了丰富的绘图函数,比如ez**系类的简易绘图函数,surf.mesh系类的数值绘图函数等几十个.另外其他专业工 ...