跟高老师学习Web前端之27.

昨天家里电灯泡坏了,书房里面黑漆漆的,我没有“挑灯夜读”的习惯,所以昨天就早早休息了,拉下的功课今天来补充。

今天开始学习文本的white-space样式,主要属性是:设置或检索对象内空格的处理方式。

代码书写

具体说明:

今天主要学习了文本内空格处理的四种方式:pre、nowrap、pre-wrap、pre-line。

pre:主要是指不合并文字间的空白间隙,当文字超出边界时不换行;

nowrap:主要是指合并文本间的多余空白直到文本结束或者遭遇<Br/>换行;

pre-wrap:主要指不合并文本间的空白距离,当文字碰到边界时发生换行;

pre-line:主要指保持文本的换行,不保留文字间的空白距离。

在此提醒一点:border属性后面不需要书写分号,这是其本身属性。

页面展示

从页面展示可以看出,pre与pre-wrap属性的不同点在于,当文本超出边界时是否发生换行,pre不换行,pre-wrap则换行。nowrap与pre-line二者均合并文本间的多余空白,但是nowrap不换行,或者遭遇<br/>换行标签时换行,而pre-line标签则保持文本的换行。

晚安!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.块级元素和行内元素 块级(block-level)元素;行内(内联、inline-level)元素。 块元素的...
    饥人谷_小侯阅读 2,037评论 1 4
  • 转载请声明 原文链接 关注公众号获取更多资讯 这篇文章主要总结H5的一些新增的功能以及一些基础归纳,这里只是一个提...
    前端进阶之旅阅读 9,099评论 22 225
  • CSS3中的word-wrap、word-break、white-space想必大家都接触过,今天我们来一起温故而...
    叮咯咙咚DQ阅读 547评论 0 0
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,089评论 0 1
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,788评论 0 2