html5--6-16 CSS3中的文字与字体
html5--6-16 CSS3中的文字与字体
中文字体包很大,少量字体的话可以有其它方法。
有字库-首页-全球第一中文web font(在线字体)服务平台、web font、webfont、在线字体、网络字体
https://www.youziku.com/
学习要点
- 掌握文字与字体的设置
颜色值查询方法:
- 百度查询,很多网站有提供
- 下载相关手册等需要时查表
- 运用绘图工具中的拾色器
CSS中常用的字体属性设置
- font-size 规定文本的字体尺寸
- 通常使用px,百分比,em来设置字体的大小
- em是css中的相对单位,是相对于当前对象内的字体尺寸,若没有制定文字大小尺寸,则为浏览器默认字体大小
- xx-small、x-small、small、medium、large、x-large、xx-large把字体的尺寸设置为不同的尺寸,默认值:medium。
- smaller 把 font-size 设置为比父元素更小的尺寸。
- arger 把 font-size 设置为比父元素更大的尺寸。
- 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:在一个声明中设置所有字体属性。
- 这个简写属性用于一次设置元素字体的两个或更多方面。
- 至少要指定字体大小和字体系列
- 可以按顺序设置如下属性:font-style/font-variant/font-weight/font-size/font-family
- @font-face:嵌入字体
- 注:字体的设置还有其他几个很少的用到的属性,比如font-size-adjust为元素规定 aspect 值;font-stretch 收缩或拉伸当前的字体系列。都很少用到或者多数浏览器不支持,就不作讲解
html5--6-16 CSS3中的文字与字体的更多相关文章
- html5--6-23 CSS3中的文字与字体
html5--6-23 CSS3中的文字与字体 text-overflow 设置是否使用一个省略标记(...)标示对象内文本的溢出 clip: 默认值当对象内文本溢出时不显示省略标记(...),而是将 ...
- html5--6-19 CSS3中的文字与字体
html5--6-19 CSS3中的文字与字体 学习要点 掌握文字与字体的设置 颜色值查询方法: 百度查询,很多网站有提供 下载相关手册等需要时查表 运用绘图工具中的拾色器 CSS中常用的字体属性设置 ...
- CSS3中与文字相关的样式
1.给文字添加阴影:text-shadow属性(特别指出IE浏览器要IE10+的版本才支持) 语法如下: text-shadow:length length length color; 其中,第 ...
- CSS3基础(2)—— 文字与字体相关样式、盒子类型、背景与边框相关样式、变形处理、动画功能
一. CSS3 文字与字体相关样式 1. 给文字添加阴影 text-shadow: length length length ccolor; 属性适用于文本阴影,指定了水平阴影,垂直阴影,模糊的距离, ...
- css3中@font-face模块自定义字体
一.@font-face模块介绍 @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,在Web的开发中使用字体不再只能使用W ...
- [CSS3]学习笔记-文字与字体相关样式
1.给文字添加阴影 <!doctype html> <html> <head> <meta charset="utf-8"> < ...
- 文字排版--字体(font-family)
我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性.下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体. body{font-family:"宋体"; ...
- html5 css3中的一些笔记
<!DOCTYPE html> <html> <head> <meta charset="utf-8" > <title> ...
- IT兄弟连 HTML5教程 CSS3属性特效 文字描边
用CSS3实现的文字描边效果,一个CSS3文字特效实例,字体可以自己随意改,字体颜色也可以自己改.IE9以下浏览器无效果,所以提醒大家测试时候要使用Google Chrome.-webkit-text ...
随机推荐
- 插头DP--URAL1519Formula 1
去年的老朋友.挺怀念的,回来看看. $n \leq 12,m \leq 12$,$n*m$的01矩形,问在0中走路的欧拉回路数.答案保证longlong范围. 先设计插头:左右括号和空插头:然后分3* ...
- msp430项目编程43
msp430综合项目---蓝牙控制直流电机调速系统43 1.电路工作原理 2.代码(显示部分) 3.代码(功能实现) 4.项目总结
- Day 5 Linux之用户、群组和权限
Linux之用户.群组和权限 一.各文件及内容对应含义 1./etc/passwd文件 功能:存储所有用户的相关信息,该文件也被称为用户信息数据库(Database). 含义:如下图所示. 2./et ...
- Flink的安装配置
一. Flink的下载 安装包下载地址:http://flink.apache.org/downloads.html ,选择对应Hadoop的Flink版本下载 [admin@node21 soft ...
- spark再总结
1.Spark是什么? UCBerkeley AMPlab所开源的类HadoopMapReduce的通用的并行计算框架. dfsSpark基于mapreduce算法实现的分布式计算,拥有HadoopM ...
- Android应用开发 WebView与服务器端的Js交互
最近公司再添加功能的时候,有一部分功能是用的html,在一个浏览器或webview中展示出html即可.当然在这里我们当然用webview控件喽 WebApp的好处: 在应用里嵌套web的好处有这么几 ...
- IntelliJ IDEA cannot resolved 处理
IntelliJ IDEA cannot resolved 处理 学习了:https://stackoverflow.com/questions/21577573/intellij-idea-can- ...
- LeetCode_Lowest Common Ancestor of a Binary Search Tree (Binary Tree)
Lowest Common Ancestor of a Binary Search Tree 一.题目描写叙述 二.思路及代码 二叉搜索树有个性质:左子树的值都比根节点小,右子树的值比根节点大.那么我 ...
- 6.非关系型数据库(Nosql)之mongodb:集群(主从复制)
1.主从复制是MongoDB最经常使用的复制方式.这样的方式很灵活,可用于备份.故障恢复.读扩展等 2最主要的设置方式就是建立一个主节点和一个或多个从节点,每一个从节点要知道主节点的地址. 执行 ...
- 在线API
JExcelApi http://jexcelapi.sourceforge.net/resources/javadocs/index.html Poi http://poi.apache.org/a ...