CSS 选用字体

最新推荐文章于 2024-07-24 11:59:51 发布
最新推荐文章于 2024-07-24 11:59:51 发布
阅读量65 收藏
点赞数
文章标签： 移动开发
原文链接：http://www.cnblogs.com/lszw/p/10577354.html
版权

font-family

CSS的font-family属性可以指定（选择）字体。

语法：

1
font-family : Gill Sans Extrabold, sans-serif ;

font-family的属性值是字体名称，有多个字体使用逗号隔开。

示例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE html>
< html lang = "en" >
< head >
     < meta charset = "UTF-8" >
     < title >font-family</ title >
     < style >
         body{
             font-family: "Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;
         }
     </ style >
</ head >
< body >
< h1 >利永贞网</ h1 >
< h2 >学编程，上利永贞网</ h2 >
< p >study hard, improve every day</ p >
</ body >
</ html >

@font-face

@font-face 允许网页开发者为其网页指定在线字体。 通过这种作者自备字体的方式，@font-face 可以消除对用户电脑字体的依赖。

@font-face 不仅可以放在在CSS的最顶层, 也可以放在 @规则 的 条件规则组 中。

@font-face 有3个常用属性

属性说明
font-family所指定的字体名字将会被用于font或font-family属性
src远程字体文件位置的URL或者用户计算机上的字体名称
format指定宝体所用的格式

示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
< html lang = "en" >
< head >
     < meta charset = "UTF-8" >
     < title >@font-face</ title >
     < style >
         @font-face{
             font-family:"maozedong";
             src:url("maozedong.ttf");
         }
         body{
             font-family: maozedong;
         }
     </ style >
</ head >
< body >
< h1 >利永贞网</ h1 >
< h2 >学编程，上利永贞网</ h2 >
< p >study hard, improve every day</ p >
</ body >
</ html >

源码下载

字体格式

在桌面上浏览器支持的字体格式有：

FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support3.5 (1.9.1)4.04.010.03.1
WOFF3.5 (1.9.1)6.09.011.105.1
WOFF239 (39)[1]38 未实现24未实现
SVG Fonts[2]未实现[3](Yes)未实现(Yes)(Yes)
unicode-range

36 (36)

(Yes)9.0(Yes)(Yes)

在手机上浏览器支持的字体格式有：

FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MiniOpera MobileSafari Mobile
Basic support(Yes)1.0 (1.9.1)?未实现10.0(Yes)
WOFF4.45.0 (5.0)10.0未实现11.05.0
WOFF2未实现39.0 (39.0)[1]未实现??未实现
SVG Fonts[2]?未实现[3]?未实现10.0(Yes)
unicode-range?36.0 (36.0)?未实现?(Yes)

转载于:https://www.cnblogs.com/lszw/p/10577354.html

weixin_30469895
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CSS 引入字体
exlinker的博客
07-18 1万+
文章目录涉及知识@font-face特点用法属性解析font-family用法简单应用更多应用网络/本地引入本地引入网络引入引入其他格式字体引入系列字体 涉及知识 @font-face @font-face 定义一个用于文本显示的自定义字体。详细内容可以参考 MDN文档 。 特点 可以自定义字体名称和与名称对应的字体文件 可以消除用户对电脑字体的依赖 可以用于字体图标的引入 用法 @font-face { font-family: "myFont"; src: url("/fonts/OpenS
CSS-字体引入
weixin_57936267的博客
05-14 157
代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t...
CSS——字体选择
TianXuab的博客
08-10 397
在CSS中，我们可以通过使用字体代码来定义网页中使用的字体。这个代码将首先尝试加载"Helvetica Neue"字体，如果无法加载，则会尝试加载Arial字体，最后如果仍然无法加载，则会使用系统默认字体。当浏览器无法加载指定的字体时，它会按照我们所定义的顺序依次尝试加载其他备选字体。总结起来，CSS提供了多种方式来定义字体，我们可以根据需要选择适合的字体代码。字体的选择应与网页的内容相匹配，并且在不同的屏幕尺寸和设备上都能够正常显示。如果浏览器无法加载第一个字体，它将尝试加载下一个字体，依此类推。
CSS字体选择（font-family）：不同的字体选择方案
weixin_41888295的博客
05-05 392
选择字体时，应该考虑到字体的大小、字体的风格、字体的可读性等因素。例如，可以使用font-weight属性来改变字体的粗细，使用font-style属性来改变字体的风格，使用font-size属性来改变字体的大小等。过于常见的字体可能会在用户的电脑上出现问题，因此需要避免使用过于常见的字体。总之，CSS文本字体的选择是一个非常重要的问题，需要考虑到字体的大小、字体的风格、字体的可读性等因素，避免使用过于常见的字体，使用CSS属性来进行字体选择，使用CSS框架来进行字体选择。2、避免使用过于常见的字体。
css的字体样式和选择器
doudouboy的博客
05-30 268
font-size:字体大小 （单位:em,px,in,cm,mm,pt) font-famliy:代码样式p {font-family: "微软雅黑" } 字体（设置字体的样式：如微软黑体，宋体，黑体等） 默认字体大小是16px font-weight:字体粗细 属性值：normal bold bolder lighter 100-900(取100的整数）（400=normal...
CSS基础选择器、字体和文本样式
自动花钱机的博客
06-22 1270
CSS层叠样式表，CSS简介：CSS（层叠样式表Cascading Style Sheets）（CSS样式表或级联样式表）、CSS语法规范、CSS代码风格；CSS基础选择器：标签选择器、类选择器、id选择器、通配符选择器；CSS字体和文本样式：字体样式、字体大小、字体粗细、字体类型、常见取值、渲染规则；文本样式：文本缩进：text-indent、文本水平对齐方式：text-align、文本修饰：text-decoration、line-height行高；CSS的引入方式：内嵌式、外联式、行内式；综合案例。.
零基础CSS入门教程(8)——CSS设置字体
weixin_61808806的博客
12-08 6347
我们前几个小结学习了，css的选择器，和及基本的改变字体颜色。我们这一小结学习一下设置字体的一些功能(1)font-size这个是设置字体大小，浏览器一般默认字体是16px (2)font-weight 这个是字体加粗和html字体加粗一样效果正常是400或写normal 加粗值是700或写bold (3)font-style是设置字体倾斜和html字体倾斜一样效果，倾斜写italic，不倾斜写normal (4)font-family可以设置字体形式 在后面加sans-serif是无衬线字体写这个墓地为了
CSS字体属性全解析
12-13
话说CSS字体属性font-family、font-style、font-size、font-weight、...支持按照优先级顺序列出各种要指派使用的字体，当用户系统没有安装首选字体时候，向后搜索，选用下一个指派的字体解析显示。如： 复制代码代码
HTML5时代CSS设置漂亮字体取代图片
09-25
如果前面所有列出的字体都无法使用，浏览器会选用默认的无衬线字体。`sans-serif`通常在Linux系统中表现良好，因为它们通常提供了一套完整的无衬线字体集。 通过这种方式，我们可以确保无论用户使用哪种操作系统或...
CSS 字体属性font相关的用法
12-11
在CSS（层叠样式表）中，字体属性用于控制网页元素的文字表现，包括字体类型、大小、风格、粗细和颜色等方面。以下是对这些属性的详细说明： 1. **字体名称属性 (font-family)**: `font-family` 属性用于设置元素的...
京东css_html_京东css规范_css_
10-04
6. **颜色与字体**：根据京东的品牌风格，选用相应的颜色方案和字体组合，保持视觉一致性。 在“jd”这个压缩包中，我们可以找到实现上述概念的HTML和CSS文件。通过分析这些文件，我们可以学习到如何将理论知识应用...
css中font的简写方法(包括粗细、大小、行高、字体)
12-13
`sans-serif`是一个通用类别，代表无衬线字体，如果前面所有字体都无法使用，浏览器会选用一个默认的无衬线字体。 总结一下，`font: bold 12px/18px Arial, Helvetica, sans-serif;`这条CSS规则的含义是： 1. 设置...
CSS 字体
weixin_30575309的博客
06-05 217
CSS字体属性定义字体，加粗，大小，文字样式。 serif和sans-serif字体之间的区别 在计算机屏幕上，sans-serif字体被认为是比serif字体容易阅读 CSS字型 在CSS中，有两种类型的字体系列名称： 通用字体系列- 拥有相似外观的字体系统组合（如 "Serif" 或 "Monospace"） 特定字体系列- 一个特定的字体系列（如 "Time...
＜html＞css样式学习（第四天） 文本样式
m0_70516782的博客
06-23 230
1、字体长度 2、颜色单位 3、字体样式 4字体的分类以及其他样式.........
css字体导入和应用
一个半路出家的人
08-29 1344
一,@font-face的使用方法 @font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中， @font-face的语法规则： @font-face { font-family: &lt;YourWebFontName&gt;; src: &lt;source&gt; [&lt;format&gt;][,&lt;source&gt; [&lt;for...
css 备用字体
hyt48079287的专栏
02-07 1403
font-family:"微软雅黑","黑体"，"宋体"
中文字体的英文名称
weixin_33736832的博客
04-06 2238
HTML，CSS，font-family：中文字体的英文名称 （宋体 微软雅黑）In 前端  @2012-09-13 宋体 SimSun 黑体 SimHei 微软雅黑 Microsoft YaHei 微软正黑体 Microsoft JhengHei 新宋体 NSimSun 新细明体 PMingLiU 细明体 ...
css系统自带字体_CSS系统字体
cuk0051的博客
08-30 3084
css系统自带字体A little bit of history 一点历史 Today 今天 The impact of Web Fonts 网络字体的影响 Enter System Fonts 输入系统字体 Popular websites use System Fonts 热门网站使用系统字体 I’m sold. Give me the code 我卖了 给我密码 A note on s...
Android系统是如何检测到ANR- 应用无响应的？
最新发布
知行合一
07-24 692
最近debug应用时，发现只要看debug的变量内容太久了，app也会爆出anr问题，遂想对ANR做一个系统的整理。
CSS样式表应用详解与常用特效
本文档主要介绍了CSS（Cascading Style Sheets）样式表的使用，包括创建、编辑、选用CSS外部样式表以及常用的CSS特效滤镜的使用方法。CSS是用于控制网页内容外观显示的一系列格式设置规则，它使得网页设计者能够更...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值