<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>54-清空默认边距</title>

    <style>

        body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{

            margin:0;padding:0

        }

        p{

            width: 610px;

            height: 110px;

            background-color: #cdcdcd;

            border: 1px solid #000000;

        }

        div{

            box-sizing: border-box;

            width: 100px;

            height: 80px;

            border: 1px solid #000;

            line-height: 20px;

            /*line-height: 80px;*/

            padding-top:20px;

            padding-bottom:20px;

        }

    </style>

</head>

<body>

<!--

1.什么是行高?

在CSS中所有的行都有自己的行高

注意点:

行高和盒子高不是同一个概念

行高指的是每行内容的高度

盒子高指的是元素的高度

规律:

1.文字在行高中默认是垂直居中的

2.在企业开发中我们经常将盒子的高度和行高设置为一样, 那么这样就可以保证一行文字在盒子的高度中是垂直居中的

简而言之就是: 要想一行文字在盒子中垂直居中, 那么只需要设置这行文字的"行高等于盒子的高"即可

3.在企业开发中如果一个盒子中有多行文字, 那么我们就不能使用设置行高等于盒子高来实现让文字垂直居中, 只能通过设置padding来让文字居中

-->

<!--<p>葬爱:非主流文化的常用词，是当今网络流行术语.且流行于非主流杀马特之中。葬，即埋葬，爱，即爱情，翻译成外语就bury love</p>-->

<!--<div>我是文字我是文字我是文字</div>-->

<!--<div>我是文字</div>-->

<div>我是文字我是文字我是文字</div>

</body>

</html>

H5 55-行高的更多相关文章

  1. fastreport 如何 设置 richview 的 行高

    richview中的行高改变有点特别.必须在AfterData 事件执行的时候才能修改: 也就是说,如果简单的放一个按钮,去发送消息给richView->RichEdit ,然后调用frxRep ...

  2. C# 对Excel 单元格格式, 及行高、 列宽、 单元格边框线、 冻结设置

    一.对行高,列宽.单元格边框等的设置 这篇简短的文字对单元格的操作总结的比较全面,特此转载过来. private _Workbook _workBook = null; private Workshe ...

  3. HTML连载42-清空默认边距、文字行高

    一.            webstorm取色技巧:webstorm内置了颜色取色器,我们对某种颜色未知的时候,可以利用下图中的取色器,进行颜色识别. 二.系统会默认给body添加外边距,因此我们对 ...

  4. css中line-height行高的深入学习

    之前对css中行高line-height的理解还是有些肤浅,深入后才发觉里面包罗万象.学习行高line-height,首先从基本原理开始 (标注该文章转载 http://www.cnblogs.com ...

  5. ios label 自动计算行高详解

    在OC当中自动计算行高主要调用系统的 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ffffff } span ...

  6. Xcode8+和iOS10+使用Masonry自动计算行高

    说起tableView的自动计算行高,真的是不想再提了,写了不知道几百遍了.可就是这麽一个小玩意儿,把我给难的不行不行的,眼看都要没头发了. 1.设置tableView的预估行高和行高为自动计算 // ...

  7. bug: 在缓存行高时,总是记录错误.

    一,现象: 1.在 cell 中添加了一个 label, 并对 label 设置了 attributeText, 结果滑动的过程中,cell 的高度总是不对,多次出现下一个 cell 覆盖上一个 ce ...

  8. line-height行高与图片的隐匿文本间隙消除方法

    (标注 文章来源 http://www.zhangxinxu.com/wordpress/2015/08/css-deep-understand-vertical-align-and-line-hei ...

  9. 第2月第24天 coretext 行高

    1.NSMutableAttributedString 行高 NSMutableAttributedString *attributedString = [[NSMutableAttributedSt ...

  10. MFC 编辑框中字体大小改变，行高不能改变，只能显示一半的问题，已解决。

    CKagulaCEdit是CEdit的一个继承类,m_edit的CKagulaCEdit类型的一个变量 调用的时候,是这样的: 编辑框中字体大小改变,行高不能改变,只能显示一半的问题,问题如下: 这时 ...

随机推荐

  1. a标签下载

    <a href="存在问题.docx" download style="color:red;font-size:20px;cursor:pointer;float: ...

  2. C#中的委托和事件 - Part.1

    注意:文中代码在VS2005下通过,由于VS2003(.Net Framework 1.1)不支持隐式的委托变量,所以如果在一个接受委托类型的位置直接赋予方法名,在VS2003下会报错,解决办法是显式 ...

  3. LeetCode算法题-Longest Palindrome（五种解法）

    这是悦乐书的第220次更新,第232篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第87题(顺位题号是409).给定一个由小写或大写字母组成的字符串,找到可以用这些字母构 ...

  4. 基于Python的多线程模块Threading小结

    步入正题前,先准备下基本知识,线程与进程的概念. 相信作为一个测试人员,如果从理论概念上来说其两者的概念或者区别,估计只会一脸蒙蔽,这里就举个例子来说明下其中的相关概念. 平安夜刚过,你是吃到了苹果还 ...

  5. 【夯实PHP基础】PHPUnit -- PHP测试框架

    本文地址 分享提纲: 1.概述 2.安装 3.编写第一个测试用例 4.PHPUnit高级 5.参考 1.概述 1)[测试框架] 它是一款轻量级的PHP测试框架,是一个xUnit的体系结构的单元测试框架 ...

  6. Linux：自动删除n天前日志

    linux是一个很能自动产生文件的系统,日志.邮件.备份等.虽然现在硬盘廉价,我们可以有很多硬盘空间供这些文件浪费,让系统定时清理一些不需要的文件很有一种爽快的事情.不用你去每天惦记着是否需要清理日志 ...

  7. C#多线程编程のTask（任务全面解析）

    Task是.NET4.0加入的,跟线程池ThreadPool的功能类似,用Task开启新任务时,会从线程池中调用线程,而Thread每次实例化都会创建一个新的线程. 我们可以说Task是一种基于任务的 ...

  8. java8中的接口与时间操作

    java8中接口可以有默认方法(用default修饰,可以有多个)和静态方法了. public interface Tran { default public String getName() { r ...

  9. Python：Day43 抽屉

    1.关于inline-block和float的理解 inline-block和float都可以实现块级标签放在同一行上,inline不好设置左右对齐,只能通过margin和padding调节.而flo ...

  10. 【vue】vue +element 搭建项目，组件之间通信

    父子组件通信 父 通过props属性给 子传递数据 子 操作 父  this.$parent.XXX 子通过$emit传递参数 或者通过vue-bus vue-bus既可以实现父子组件之间的通信,也可 ...