热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

CSS3之文字与字体相关样式

text-shadow给文字添加阴影用法:text-shadow:lengthlengthlengthcolor前面三个length分别指阴影离开文字的横向距离、
  1. text-shadow 给文字添加阴影
    用法:text-shadow: length length length color
    前面三个length分别指阴影离开文字的横向距离、阴影离开文字的纵向距离和阴影的模糊半径,color指阴影的颜色(横向距离和纵向距离可以为负数)。
    *使用text-shadow还可以给文字指定多个阴影。

  2. 让文本自动换行
    浏览器本身都自带着让文本自动换行的功能。在浏览器中显示文本的时候,会让文本在浏览器或div元素的右端自动实现换行。对于西方文字来说,浏览器会在半角空格或连字符的地方自动换行,而不会在单词的当中突然换行。对于中文来说,可以在任何一个中文字后面进行换行,当中文中含有标点符号的时候,浏览器总是不可能让标点符号位于一行文字的行首,通常将标点符号以及它前面的一个文字作为一个整体来统一换行。
    word-break可以指定自动换行的处理方法。可以让浏览器实现任意位置的换行。
    word-break属性可以使用的值:

    1. normal: 使用浏览器默认换行规则
    2. keep-all: 只能在半角空格和连字符处换行
    3. break-all: 允许在单词内换行
  3. 让长单词与URL地址自动换行
    因为在URL地址中没有半角空格,所以当URL地址中没有连字符的时候,浏览器在显示时是将其视为一个比较长的单词来进行显示的。
    在CSS3中,使用word-wrap属性来实现长单词与URL的自动换行。
    word-wrap: break-word;

  4. 使用服务器端字体
    在CSS3之前,页面文字所使用的字体必须在客户端中被安装才能正常显示。在CSS3中,使用Web Fonts可以在网页中显示安装在服务器端的字体。
    使用方法:在font-family属性值中使用“WebFont”来声明使用服务器端的字体。
   @font-face{
font-family: WebFont;
src: url('font/Fontin_Sans_R_45b.otf') format("opentype")
;
font-weight: normal;
}
  • src属性指定服务器端字体的字体文件所在的路径;
  • format属性指定字体文件的格式。
    到目前为止,可以使用的文件格式为opentypetruetype。opentype格式的文件扩展名为”.otf”,truetype格式的文件扩展名为”.ttf”。
    在针对元素使用这个服务器端字体的时候,还需要在元素样式中将font-family属性值指定为WebFont。
    例如:
  span{
font-family: WebFont;
}
  • 另外,在定义字体的时候,可以将字体定义为斜体字或者粗体字。在使用服务端字体的时候,需要根据是斜体还是粗体使用不同的字体文件。
    以粗体为例:
    @font-face{
font-family: WebFont;
src: url('font/Fontin_Sans_B_45b.otf') format("opentype")
;
font-weight: normal;
}

span{
font-family: WebFont;
font-style: bold;
}

推荐阅读
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 本文介绍了如何使用php限制数据库插入的条数并显示每次插入数据库之间的数据数目,以及避免重复提交的方法。同时还介绍了如何限制某一个数据库用户的并发连接数,以及设置数据库的连接数和连接超时时间的方法。最后提供了一些关于浏览器在线用户数和数据库连接数量比例的参考值。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • 本文介绍了Web学习历程记录中关于Tomcat的基本概念和配置。首先解释了Web静态Web资源和动态Web资源的概念,以及C/S架构和B/S架构的区别。然后介绍了常见的Web服务器,包括Weblogic、WebSphere和Tomcat。接着详细讲解了Tomcat的虚拟主机、web应用和虚拟路径映射的概念和配置过程。最后简要介绍了http协议的作用。本文内容详实,适合初学者了解Tomcat的基础知识。 ... [详细]
  • 分享2款网站程序源码/主题等后门检测工具
    本文介绍了2款用于检测网站程序源码和主题中是否存在后门的工具,分别是WebShellkiller和D盾_Web查杀。WebShellkiller是一款支持webshell和暗链扫描的工具,采用多重检测引擎和智能检测模型,能够更精准地检测出已知和未知的后门文件。D盾_Web查杀则使用自行研发的代码分析引擎,能够分析更为隐藏的WebShell后门行为。 ... [详细]
  • vue组件支持预处理语言的关键点:<stylerelstylesheetscss>.mint-swipe{hei ... [详细]
  • 向QTextEdit拖放文件的方法及实现步骤
    本文介绍了在使用QTextEdit时如何实现拖放文件的功能,包括相关的方法和实现步骤。通过重写dragEnterEvent和dropEvent函数,并结合QMimeData和QUrl等类,可以轻松实现向QTextEdit拖放文件的功能。详细的代码实现和说明可以参考本文提供的示例代码。 ... [详细]
  • 本文介绍了使用PHP实现断点续传乱序合并文件的方法和源码。由于网络原因,文件需要分割成多个部分发送,因此无法按顺序接收。文章中提供了merge2.php的源码,通过使用shuffle函数打乱文件读取顺序,实现了乱序合并文件的功能。同时,还介绍了filesize、glob、unlink、fopen等相关函数的使用。阅读本文可以了解如何使用PHP实现断点续传乱序合并文件的具体步骤。 ... [详细]
  • XML介绍与使用的概述及标签规则
    本文介绍了XML的基本概念和用途,包括XML的可扩展性和标签的自定义特性。同时还详细解释了XML标签的规则,包括标签的尖括号和合法标识符的组成,标签必须成对出现的原则以及特殊标签的使用方法。通过本文的阅读,读者可以对XML的基本知识有一个全面的了解。 ... [详细]
  • Linux如何安装Mongodb的详细步骤和注意事项
    本文介绍了Linux如何安装Mongodb的详细步骤和注意事项,同时介绍了Mongodb的特点和优势。Mongodb是一个开源的数据库,适用于各种规模的企业和各类应用程序。它具有灵活的数据模式和高性能的数据读写操作,能够提高企业的敏捷性和可扩展性。文章还提供了Mongodb的下载安装包地址。 ... [详细]
  • 可能我们在看一些网页的源码时会发现自己从来没见过的属性或用法今天我就来总结一下CSS3的冷知识样式计算在CSS中也可以进行简单的计算通过calc函数可以实现这样还可以使我们的 ... [详细]
  • 1、给边框加上圆角及阴影,如下代码:<!DOCTYPEhtmlPUBLIC"-W3CDTDHTML4.01TransitionalEN"" ... [详细]
  • http:js.alixixi.coma2014021292298.shtmlhttp:w3cshare.comexample?pid134http:w3cshare.comc ... [详细]
  • 在DIV内垂直居中UL - Centering Vertically an UL inside a DIV
    iamtryingtomakeanavigationmenuinsidea200pxx200pxsquare,thisnavigationlist(UL)chang ... [详细]
  • 这篇文章主要为大家展示了“html5+css3网站菜单的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习 ... [详细]
author-avatar
ccM保佑加琳诺爱儿1984f
这个家伙很懒,什么也没留下!
Tags | 热门标签
RankList | 热门文章
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有