您现在的位置是：网站首页> 编程资料编程资料

Css样式--字体样式和链接样式详解CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题

2021-09-07 827人已围观

简介字体样式和链接样式是css样式中的一部分，在本文将为大家详细介绍下，希望对大家有所帮助

1.指定字体：font-family

（1）实用通用字体系列：

复制代码

代码如下:

body {font-family: sans-serif;}

（2）制定字体系列：

复制代码

代码如下:

h1 {font-family: Georgia, serif;}

在所有 font-family 规则中都提供一个通用字体系列。这样就提供了一条后路，在用户代理无法提供与规则匹配的特定字体时，就可以选择一个候选字体。【serif】
（3）实用引号：

只有当字体名中有一个或多个空格（比如 New York），或者如果字体名包括 # 或 $ 之类的符号，才需要在 font-family 声明中加引号

2.字体风格：

normal - 文本正常显示
italic - 文本斜体显示
oblique - 文本倾斜显示

【重点：字体的缩写字体：style variant weight size line-height family】

复制代码

代码如下:

font-style:italic;
font-variant:small-caps;//可以设定小型大写字母
font-weight:bold;
font-size:1em;//em：pixels/16=em
line-height:140%;
font-family:"Lucida Grande",sans-serif;

可以缩写为

复制代码

代码如下:

font:italic small-caps bold 1em/140%"Lucida Grande",sans-serif;

CSS 字体属性

属性	描述
font	简写属性。作用是把所有针对字体的属性设置在一个声明中。
font-family	设置字体系列。
font-size	设置字体的尺寸。
font-size-adjust	当首选字体不可用时，对替换字体进行智能缩放。（CSS2.1 已删除该属性。）
font-stretch	对字体进行水平拉伸。（CSS2.1 已删除该属性。）
font-style	设置字体风格。
font-variant	以小型大写字体或者正常字体显示文本。
font-weight	设置字体的粗细。

3.设置链接样式

复制代码

代码如下:

a:link {color:#FF0000;} /* 未被访问的链接 */
a:visited {color:#00FF00;} /* 已被访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标指针移动到链接上 */
a:active {color:#0000FF;} /* 正在被点击的链接 */

当为链接的不同状态设置样式时，请按照以下次序规则：

a:hover 必须位于 a:link 和 a:visited 之后
a:active 必须位于 a:hover 之后

上一篇：css div实现的遮罩层完美兼容IE6-IE9 FireFoxCSS实现鼠标移至图片上显示遮罩层效果SCSS移动端页面遮罩层效果的实现及常见问题解决CSS实现带遮罩层可关闭的弹窗效果

下一篇：CSS样式定义的优先级顺序介绍CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题

您现在的位置是：网站首页> 编程资料编程资料

相关内容

点击排行

本栏推荐

猜你喜欢