<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>行间距</title>
<style type="text/css">
/*
在css中并没有为我们提供一个直接设置行间距的方式
我们只能通过设置行高来简介的设置行间距,行高越大行间距越大
使用line-height来设置行高
行高类似于我们上学用的单线本,单线本是一行一行,线与线之间的距离就是行高
网页中的文字实际上也是处在看不见的行中,而文字会默认在行高中垂直居中显示
行间距 = 行高 - 字体大小
*/
.p1{
/*
在font中也可以指定行高
相当于20px的字体大小,40px的行高
在字体大小后可以添加/行高,来制定行高,该值是可选的,如果不选则会使用默认值
*/
font: 20px/40px "微软雅黑";
/*
通过设置line-height可以间接设置行高
可以接受的值
1. 直接接受一个大小
2. 可以指定一个百分数
3. 可以直接传一个数值,则行高会设置字体大小相应的倍数
*/
}
.box{
height: 200px;
width: 200px;
background-color: yellow;
/*
对于单行文本来说,可以将行高设置为和父元素的高度一致
这样可以在父元素中垂直居中
*/
line-height: 200px;
}
</style>
</head>
<body>
<div class="box">
文文本文本
</div>
<p class="p1">
南无、喝啰怛那、哆啰夜耶,南无、阿唎耶,婆卢羯帝、
烁钵啰耶,菩提萨埵婆耶,摩诃萨埵婆耶,摩诃、迦卢尼
迦耶,唵,萨皤啰罚曳,数怛那怛写,南无、悉吉栗
埵、伊蒙阿唎耶,婆卢吉帝、室佛啰楞驮婆,南无、那啰
谨墀,醯利摩诃、皤哆沙咩,萨婆阿他、豆输朋,阿逝孕
,萨婆萨哆、那摩婆萨哆,那摩婆伽,摩罚特豆.怛侄他.
唵,阿婆卢醯.卢迦帝.迦罗帝.夷醯唎.摩诃菩提萨埵,萨
婆萨婆.摩啰摩啰,摩醯摩醯、唎驮孕.俱卢俱卢、羯蒙.
度卢度卢、罚阇耶帝.摩诃罚阇耶帝.陀啰陀啰.地唎尼.室
佛啰耶.遮啰遮啰.摩么罚摩啰.穆帝隶.伊醯伊醯.室那室
那.阿啰参、佛啰舍利.罚沙罚参.佛啰舍耶.呼嚧呼嚧摩啰
.呼嚧呼嚧醯利.娑啰娑啰,悉唎悉唎.苏嚧苏嚧.菩提夜、
菩提夜.菩驮夜、菩驮夜.弥帝唎夜.那啰谨墀.地利瑟尼
那.婆夜摩那.娑婆诃.悉陀夜.娑婆诃.摩诃悉陀夜.娑婆
诃.悉陀喻艺.室皤啰耶.娑婆诃.那啰谨墀.娑婆诃.摩啰
那啰.娑婆诃.悉啰僧、阿穆佉耶,娑婆诃.娑婆摩诃、阿
悉陀夜.娑婆诃.者吉啰、阿悉陀夜.娑婆诃.波陀摩、羯
悉陀夜.娑婆诃.那啰谨墀、皤伽啰耶.娑婆诃.摩婆利、胜
羯啰夜.娑婆诃.南无、喝啰怛那、哆啰夜耶,南无、阿唎
耶.婆嚧吉帝.烁皤啰夜.娑婆诃.唵,悉殿都.漫多啰.跋
陀耶,娑婆诃.
</p>
</body>
</html>