文字修饰

1.文字修饰:

text-decoration : underline下划线 ,none没有修饰, over-line上划线 ,line-through中划线

vertical-align : 竖直对齐方式   text-align: center : 水平居中

2.内容超出处理:

overflow :visible(默认) |auto |hidden |scroll

visible不裁剪内容,可能会显示在内容框之外。

auto 容器自适应内容,内容高度超出容易,会出现竖直滚动条,如果内容宽度超出容器,会出现水平滚动条

hidden 是把超出容器的内容部分给裁减掉

scroll  给容器设置滚动条,如果内容没有超出容器,将无法滚动

overflow-x: 对容器的水平方向处理

overflow-y: 对容器的垂直方向处理

3.overflow-x/y:

visible |hidden |scroll |auto |no-display |no-content;

visible不裁剪内容,可能会显示在内容框之外。

hidden裁剪内容 - 不提供滚动机制。

scroll裁剪内容 - 提供滚动机制。

auto如果溢出框,则应该提供滚动机制。

no-display如果内容不适合内容框,则删除整个框。

no-content如果内容不适合内容框,则隐藏整个内容。

4.颜色单位:

英文单词 / 16进制  / rgb / transparent

5.字号设置:

px:绝对单位,页面按精确像素展示

百分比:相对单位,相对于浏览器默认字号

em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。

rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算

6.font-weight 字重:

bold(500~900)    加粗   bolder 更粗(已淘汰)

lighter(100~300) 更细   normal(400)正常的

font-style:

7.斜体设置  italic

正常设置noraml

8.font-family 字体设置:

设置多个字体用逗号隔开 用双引号包裹 (Arial一般最后一个,多系统支持)

解析风格:sans-serif(比较圆润),serif棱角多

9.首行缩进:

text-indent: 2em;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,687评论 1 92
  • 1.CSS简介 Cascading Style Sheet 层叠样式表 主要用来定义页面中的表现,HTML 描述页...
    hyt222阅读 4,430评论 0 0
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 4,738评论 0 1
  • 因为橙子,提起了樱桃,那就不合时令的说一说春夏之交的樱桃,说一说因为一句“红了樱桃,绿了芭蕉”而被称为“樱桃进士”...
    柳桥阅读 7,334评论 0 4
  • 小小不喜欢记流水账,从出身讲到现在,读者不烦我自己都嫌弃我自己了。所以小小想从 情窦初开 的年纪开始说。 九...
    酸奶小小阅读 3,576评论 0 0

友情链接更多精彩内容