CSS ：段首缩进两个汉字
<style>#mydiv {
padding: 20px;
width: 700px;
min-height: 300px;
font-size: 12px;
text-indent: 2em;
border: 1px solid tan;
}
</style>
<div id="mydiv">
<h2>使用 em 缩进两个汉字</h2>
<p>我们经常使用 em 来定义字体大小。em 是一个相对长度单位，它是在全局字体大小设定的基础上对字体大小进行缩放，因而无论字体大小具体如何设置，em 作为缩进样式单位，都可以自适应从而实现缩进两个汉字的尺寸。</p>
<p>要缩进文本，请使用 text-indent 属性，它表示段落首行缩进多少单位。例如：</p>
<p>text-indent: 2em;</p>
<p>上例，特定选择器设置了 text-indent 属性为 2em，这意味着无论全局和当前元素字体大小设置为多少、如何变化，都能自适应缩进2个汉字的空格效果。</p>
</div>
<p> <br>
<label for="font_size">设置字体大小 ：</label>
<input id="font_size" type="range" min="10" max="60" value="12" oninput="output.value=this.value" />
<output id="output">12</output>
</p>
<script>
font_size.onchange = () => mydiv.style.fontSize = font_size.value + 'px';
</script> 所谓段落，通常以 <p>...</p> 标签表示，p 就是段落 paragraph 的缩写。p 标签内的文本，如果呈现在元素中是多行，一般会自动折行，这时，折行后的“行”是不自动缩进的，所以我们称行首缩进；如果文本很短不折行，该行会缩进。 黑黑不但讲解了首行缩进，还额外讲解了em长度单位，以前也用过，还从来没发觉它的独到之处呢{:4_199:} 这个太好了，仔细读了又读，争取记住，刻在脑子里{:4_205:} 红影 发表于 2023-7-29 16:55
这个太好了，仔细读了又读，争取记住，刻在脑子里
这个特简单的，按理看一眼就能记住 红影 发表于 2023-7-29 16:54
黑黑不但讲解了首行缩进，还额外讲解了em长度单位，以前也用过，还从来没发觉它的独到之处呢
在不同的环境使用em，你会发现字的大小实际上是不一样的，这是因为不同环境对字体大小的初始设定不尽一样 醉美水芙蓉 发表于 2023-7-29 17:59
跟着老师学习！
这个简单的。所有庞杂的知识体系，都是有简单的一一组成。 缩进常见，在线演示比较厉害{:4_199:} 花飞飞 发表于 2023-7-29 18:46
缩进常见，在线演示比较厉害
网页使用缩进的不多 马黑黑 发表于 2023-7-29 20:21
网页使用缩进的不多
特别是代码贴子好象也不怎么用。网页内有大量的文字，排版才用得上吧 花飞飞 发表于 2023-7-29 20:48
特别是代码贴子好象也不怎么用。网页内有大量的文字，排版才用得上吧
对。追求排版完美的，会有需求。 马黑黑 发表于 2023-7-29 20:55
对。追求排版完美的，会有需求。
做文字的必须的吧。排版漂亮网页才漂亮。。
花飞飞 发表于 2023-7-29 21:05
做文字的必须的吧。排版漂亮网页才漂亮。。
这个也都是根据需要来。你注意比较一下英文的排版，是不是两端对齐比较完美。 马黑黑 发表于 2023-7-29 17:55
这个特简单的，按理看一眼就能记住
是啊，看完了是能够记住，就怕时间长了忘了呀。所以要多看看。 马黑黑 发表于 2023-7-29 17:56
在不同的环境使用em，你会发现字的大小实际上是不一样的，这是因为不同环境对字体大小的初始设定不尽一样
但是这个经常被用来直接定义字体大小呢。 马黑黑 发表于 2023-7-29 21:19
这个也都是根据需要来。你注意比较一下英文的排版，是不是两端对齐比较完美。
嗯哪。。回去看看那个中文对照的，的确如此。。
中文每行字数差得有点多的话两端对齐就怪怪的。 花飞飞 发表于 2023-7-29 22:30
嗯哪。。回去看看那个中文对照的，的确如此。。
中文每行字数差得有点多的话两端对齐就怪怪的。
强制的才怪 马黑黑 发表于 2023-7-29 22:46
强制的才怪
不情不愿的。。{:4_170:} 花飞飞 发表于 2023-7-29 22:58
不情不愿的。。
强制两端对齐还是挺有用的。比方说，我会用两个伪元素放置播放器时间信息，如果使用两端对齐，一个就够了。我试过，不过没有正式使用。
页:
[1]
2