CSS学习第五天-文本样式

举报
多米诺的古牌 发表于 2021/02/09 09:23:21 2021/02/09
【摘要】 1、字体    1.1 字体样式 字体 font-family ;字体大小 font-size ;字体粗细 font-weight;        可以连写,如下格式:        font{         (1)字体风格(斜体-oblique) (2)字体粗细(bloder或100)(3)大小/行高 (12px/20px) (4)字体样式(“楷体 ”)        }   2、文本 ...

1、字体
    1.1 字体样式 字体 font-family ;字体大小 font-size ;字体粗细 font-weight;
        可以连写,如下格式:
        font{
         (1)字体风格(斜体-oblique) (2)字体粗细(bloder或100)(3)大小/行高 (12px/20px) (4)字体样式(“楷体 ”)
        } 
  2、文本
    2.2 首行缩进 text-indent:2em;(备注:1em为1个字符宽度,1px为1个像素)
    2.3 水平居中 text-align: center
    2.4 垂直居中 设置块元素的高度 height 然后 将文本的高度 line-height设置成和height相同的高度,即达到垂直居中的效果
    2.5 上划线 text-decoration: overline;
        中划线 text-decoration: line-througt;
        下划线 text-decoration: underline;
        取消a标签的下划线 text-decoration: none;
    2.6 文本图片关联调节
        将文字放在图片旁边的垂直居中位置,关联调节需要参照物,所以要把两个元素都写上
        eg: img,span{
          vertical-align: middle;
        }
    2.7 a标签伪类
        a:hover{color: #FF0000} 鼠标悬停
        a:active{color: #FF0000} 选中链接
        a:linke{color: #FF0000} 未访问的链接
        a:visited{color: #FF0000} 已访问的链接
    2.8 阴影 text-shadow: 水平阴影位置(必需 可负值) 垂直阴影位置(必需 可负值) 模糊距离 阴影的颜色
        eg:text-shadow:0px 0px 1px #ACACAC 可以让网页字体渲染的更清晰

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。