美文网首页
CSS3 文字与字体相关样式

CSS3 文字与字体相关样式

作者: 兔子不打地鼠打代码 | 来源:发表于2018-01-18 21:22 被阅读7次

一、给文字添加阴影

语法:
length1—阴影离开文字横向方向的距离
length2—阴影离开文字纵向方向的距离
length3—模糊程度
color—阴影颜色

text-shadow:length1 length2 length3 color

实例

div{
    text-shadow: 5px 5px 5px blue;
    color: grey;
    font-size: 25px;
    font-weight: 200;
}

二、使用服务器端字体

语法:
normal—使用浏览器的默认换行规则
keep-all—只能在半角空格或连字符处进行换行
break-all—允许在单词间进行换行
实例:
如何在服务端使用上传的字体

@font-face{
    font-family: WebFont;
    src: url("字体安装包.ttf/otf")format("truetype/opentype");
    font-weight: normal;
}

div.page{
    font-family: WebFont;
}

三、修改字体种类而保持字体尺寸不变

字体样式不同会导致同一字码的字体显示出来的大小不一样,因此css3增加了font-size-adjust 属性。

实例:

#div1{
     font-family: Menlo;
     font-size: 16px;
    font-size-adjust: 0.60;
}
  • 如何计算font-size-adjust:aspect中asipect的值?
    aspect = chracter's high / font-size
  • 如何得知浏览器实际显示的字体大小?
    通过公式c= (a/b)s
    c:浏览器实际显示的字体尺寸
    a: 实际使用的aspect字体的值
    b: 修改前,字体aspect值
    s:当前字体的尺寸

相关文章

  • CSS3 文字与字体相关样式

    一、给文字添加阴影 语法:length1—阴影离开文字横向方向的距离length2—阴影离开文字纵向方向的距离le...

  • CSS3字体与字体相关样式

    给文字添加阴影 使用服务器端字体 修改文字种类而保持字体尺寸不变

  • CSS3文字及字体相关样式

    1、文本阴影 text-shadow:length length shadow color; 取值:

  • 10. css3文字与字体相关样式

    10.1 给文字添加阴影 说明:给文字添加阴影的基本使用请参考2.2-(5)text-shadow;可设置多重阴...

  • css3-文字与字体相关样式

    text-shadow属性-给文字添加阴影 1.text-shadow属性的使用方法 给页面上的文字添加阴影效果 ...

  • [iOS]中字体样式设置 API

    今天项目需求里要求给文字设置字体样式, 以前的工作中并没有涉及字体样式的设置, 后来在网上找到了相关的方法, 这里...

  • CSS3笔记-文字与字体样式

    1. 给文字添加阴影---text-shadow 值从左至右分别代表:阴影离开文字横向距离、纵向距离、模糊半径、阴...

  • 九、CSS字体属性与文本属性

    一、CSS字体属性与文本属性 1、CSS字体属性 CSS Fonts(字体)属性用于定义、大小、粗细、和文字样式(...

  • CSS格式化排版

    文字排版-字体 我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。 这里注意不要设置不常用的字体...

  • 2019-04-17 css样式

    css样式导入 文字样式 字体大小 最小不可以小于十二像素 字体类型 字体加粗 bold=700 字体风格 it...

网友评论

      本文标题:CSS3 文字与字体相关样式

      本文链接:https://www.haomeiwen.com/subject/tzbuoxtx.html