CSS font-family 属性

news/2024/7/24 12:23:51 标签: css的font-family属性


7.1. CSS font-family 属性

7.1.1. CSS family-name 系列性字体名称 7.1.2. CSS generic-family 一般性字体名称
font-family -- 定义使用的字体
  • 取值: [[ <family-name> | <generic-family> ] [, <family-name>| <generic-family>]* ] | inherit
    • [[ <family-name> | <generic-family> ] [, <family-name>| <generic-family>]* ]:字体名
      • family-name: 一系列字体名称
      • generic-family: 一般性字体名称,取值:serif,sans-serif,cursive,fantasy,monospace
    • inherit:继承
  • 引用网址:http://www.dreamdu.com/css/property_font-family/
  • 初始值: 根据用户计算机的默认字体
  • 继承性: 是
  • 适用于: 所有元素
  • font:中文"字体"的意思.family:中文"家族"的意思.

示例

p#songti 
{ 
	font-family:"宋体";
} 

p#Arial 
{ 
	font-family:Arial;
}  

p 
{
	font-family:"宋体",Arial;
}

比如中文的宋体,英文的Arial,可以定义多种字体连在一起,使用,(逗号)分隔

CSS font-family 属性示例 -- 可以尝试编辑

  • CSS font-family 属性示例
  • CSS generic-family 一般性字体名称示例

说明

  • 想要显示的字体一定要是你计算机中有的,否则不会按照你期望的显示.上面的第三个示例说明如果有宋体就显示宋体否则显示Arial字体
  • [字体名1 , 字体名2 , *],其中的星号*,表示可以继续增加字体名.如果用户计算机没有安装,你定义的字体名1,系统会自动使用字体名2,如果没有字体名2,系统就再查找字体名3,如果都没有,将使用系统的默认字体
  • family-name代表系列性字体的名称,比如可以使用逗号分开,的方式取一系列的值("Times","Arial","Courier"等)
  • generic-family代表一般性字体名称,每个名称都可以代表一系列的字体,比如"serif", "sans-serif", "cursive", "fantasy", "monospace"
  • 用逗号来分隔每一个值,最好在最后有一个基本字体(generic-family)
  • 使用中文字体或者英文名称超过一个单词的字体时要使用"(冒号)扩起来,比如"Times News Roman","宋体"
  • HTML的font标签定义了字体,此标签已经被w3c抛弃
  • 真正符合标准网页设计的字体定义方法是使用font-family CSS属性




http://www.niftyadmin.cn/n/1622676.html

相关文章

mysql erparseerror_Parse error: syntax error, unexpected 'mysql_error' (T_STRING) in

Parseerror:syntaxerror,unexpectedmysql_error(T_STRING)inC:\Apache24\htdocs\dbwrap.phponline35请问各位这该怎么改&#xff1f;源代码如下&#xff1a;<?phpinclude ("dbwrap.php");$dbanewdbwrap()...Parse error: syntax error, unexpected mysql_error (…

height和line-height

1、height&#xff1a; 文字在左上方显示&#xff0c;在IE中文字离上边0px&#xff0c;在FF\Chrome\360中&#xff0c;文字离上边1px&#xff0c;离左边都是0px&#xff0c; 2、line-height&#xff1a; 文字近似垂直居中显示&#xff0c;在IE中文字顶部离上边的距离比文字底…

滚动条scrollbar

页面滚动条 对于IE浏览器&#xff0c;可以单独设置滚动条样式&#xff0c;从而使其更加符合网站的整体设计。 滚动条组成 &#xff1a; 3dlight、highlight、face、arrow、shadow、darkshadow 组成 3dlight、highlight&#xff1a;高亮部分&#xff0c;都只有一个像素&#xf…

AgileEAS.NET 4.0 重构裁剪后的程序集说明

前几天在文章AgileEAS.NET 4.0重构裁剪&#xff0c;新的ORM、支持Linq&#xff0c;正式支持WPF&#xff0c;开放更多的接口简单的介绍了一下AgileEAS.NET平台在2011年初的一些重大改进措施&#xff0c;其中涉及对原有程序集的合作与裁剪处理&#xff0c;将原有的近70个程序集合…

python web开发基础_Python爬虫技术--基础篇--Web开发(中)

1.WSGI接口了解了HTTP协议和HTML文档&#xff0c;我们其实就明白了一个Web应用的本质就是&#xff1a;浏览器发送一个HTTP请求&#xff1b;服务器收到请求&#xff0c;生成一个HTML文档&#xff1b;服务器把HTML文档作为HTTP响应的Body发送给浏览器&#xff1b;浏览器收到HTTP响…

Page翻页分页css代码,分页div+css代码

css分页代码集合模板如下 翻页上下分页按钮效果一 DIV代码&#xff1a;<div class"digg"> <span class"disabled">< </span><span class"current">1</span><a href"#?page2">2</a><…

angularjs1-7,http,location

<!DOCTYPE HTML> <html> <head><meta http-equiv"Content-Type" content"text/html; charsetutf-8"><title>无标题文档</title><script src"angular.min.js"></script></head><body n…

一、初探Javascript魅力(1)_看智能社blue老师JS视频整理的笔记

1、javascript是什么 根据用户的一些操作&#xff0c;然后来修改页面上的一些元素、属性等。 &#xff08;1&#xff09;HTMLCSS静态页面&#xff0c;JS给页面添加动的效果 &#xff08;2&#xff09;网页特效的原理 javascript就是修改样式 &#xff08;3&#xff09;编写…