3.css3文字与字体

时间：2022-09-12 13:51:02

1.css3文字与字体：

3.css3文字与字体

①Font-size：大小。

　　⑴通常使用px、百分比、em来设置大小；

　　⑵xx-small、x-small、small、medium、large、x-large、xx-large设置为不同尺寸，默认值medium；

　　⑶smaller设置为比父元素更小的尺寸；

　　⑷larger设置为比父元素更大的尺寸；

②Font-variant：规定是否以小型大写字母的字体显示文本。

　　⑴Normal默认值，浏览器会显示一个标准字体；

　　⑵Small-caps浏览器会显示小型大写字母的字体；

③Font-style：样式。

　　⑴Normal默认值，显示一个标准字体；

　　⑵Italic显示一个斜体的样式；

　　⑶Oblique显示一个斜体的样式；

④Font-weight：粗细。

　　⑴Normal默认值；

　　⑵Bold粗体；

　　⑶Bolder更粗的粗体，lighter更细的字体；

　　⑷100-900：定义由粗到细的字体。400等同于normal，700等同于bold；

⑤Font-family：字体系列（宋体、楷体、黑体）。

⑥Font：在一个声明中设置所有字体属性。

　　⑴至少要指定字体大小size和字体系列family；

　　⑵可以按默认顺序设置：font-style/font-variant/font-weight/font-size/font-family；

　　 3.css3文字与字体

⑦@font-face：嵌入字体。

有字网：https://www.webfont.com/vipcsslist/index

3.css3文字与字体的更多相关文章

  1. css3文字与字体样式

    css3使用服务器端字体: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  2. CSS3 文字与字体相关样式

    给文字添加阴影 文字换行 客户端文字 font-size-adjust属性 给文字添加阴影-text-shadow属性 text-shadow:length length length color 前 ...

  3. css3文字与字体的相关样式

    给文字添加阴影——text-shadow属性 text-shadow属性是css2中定义的,在css2.1中删除了,在css3中恢复text-shadow:length length length c ...

  4. css3文字与字体

    ---恢复内容开始--- 1.text-overflow(用来设置是否使用省略标记)必须和white-space:nowrap 同时使用white-space:nowrap(强制文本在一行显示) wo ...

  5. CSS3文字与字体 text-overflow 与 word-wrap

    text-overflow 对象内的文本溢出部分采用省略“...”标记 或者 剪切: text-overflow:elip(超出容器边界的内容剪切掉)  | ellipsis(超出容器边界内容省略标示 ...

  6. CSS3基础&lpar;2&rpar;—— 文字与字体相关样式、盒子类型、背景与边框相关样式、变形处理、动画功能

    一. CSS3 文字与字体相关样式 1. 给文字添加阴影 text-shadow: length length length ccolor; 属性适用于文本阴影,指定了水平阴影,垂直阴影,模糊的距离, ...

  7. CSS3文字描边 CSS3字体外部描边

    给需要实现文字描边的元素添加如下CSS3的属性 text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0; -webkit-t ...

  8. html5--6-16 CSS3中的文字与字体

    html5--6-16 CSS3中的文字与字体 中文字体包很大,少量字体的话可以有其它方法. 有字库-首页-全球第一中文web font(在线字体)服务平台.web font.webfont.在线字体 ...

  9. html5--6-23 CSS3中的文字与字体

    html5--6-23 CSS3中的文字与字体 text-overflow 设置是否使用一个省略标记(...)标示对象内文本的溢出 clip: 默认值当对象内文本溢出时不显示省略标记(...),而是将 ...

随机推荐

  1. js继承方式

    1.原型链 实现的本质是重写原型对象,代之以一个新类型的实例: 给原型添加方法的代码硬顶放在替换原型的语句之后: 不能使用对象字面量查收能见原型方法,这样会重写原型链. 缺点:包含引用类型值的原型属性 ...

  2. ios上position&colon;fixed失效问题

    手机端上的猫腻真是多啊~~~ 此起彼伏! 最近又遇到了 固定定位的底部导航在ios上被弹出去 此时内心1w+个*奔过~~~~~~~~ 直接上解决方案: <div class="ma ...

  3. 使用HttpWebRequest和HtmlAgilityPack抓取网页（拒绝乱码，拒绝正则表达式）

    废话不多说, 直接说需求. 公司的网站需要抓取其他网站的文章,但任务没到我这,同事搞了一下午没搞出来.由于刚刚到公司, 想证明下自己,就把活揽过来了.因为以前做过,觉得应该很简单,但当我开始做的时候, ...

  4. Lo-Dash – 替代 Underscore 的优秀 JS 工具库

    前端开发人员大都喜欢 Underscore,它的工具函数很实用,用法简单.这里给大家推荐另外一个功能更全面的 JavaScript 工具——Lo-Dash,帮助你更好的开发网站和 Web 应用程序. ...

  5. Linux小知识

    1,ubuntu下,开机如何进行命令行? 图形模式下,首先进入终端: 1. 找到 /etc/default/grub文件: 2. 修改 GRUB_CMDLINE_LINUX_DEFAULT=&quot ...

  6. CSS3&lowbar;边框属性之圆角的基本图形案例

    一.正方形 div{ background:#F00; width:100px; height:100px;}   二.长方形 div{background:#F00;width:200px;heig ...

  7. 卷积神经网络和CIFAR-10：Yann LeCun专访 Convolutional Nets and CIFAR-10&colon; An Interview with Yann LeCun

    Recently Kaggle hosted a competition on the CIFAR-10 dataset. The CIFAR-10 dataset consists of 60k 3 ...

  8. BZOJ 1083&colon; &lbrack;SCOI2005&rsqb;繁忙的都市 裸的最小生成树

    题目链接: http://www.lydsy.com/JudgeOnline/problem.php?id=1083 代码: #include<iostream> #include< ...

  9. selenium添加源码，解决打开源码不显示问题

    问题1: 我已经导入了源码包,单在源码中点击get,想查看源码 WebDriver driver=new FirefoxDriver(); driver.get("http://www.ba ...

  10. asp&period;net Listbox控件用法

    2008-02-18 19:56 来源: 作者: ListBox(列表框)控件可以显示一组项目的列表,用户可以根据需要从中选择一个或多个选项.列表框可以为用户提供所有选项的列表.虽然也可设置列表框为多 ...

相关文章