前言 ---- font-family 属性用于给元素指定字体,是开发中使用非常频繁的一个属性 该属性的值是一个字体系列,每个值使用逗号隔开,如果字体名名称包含空格,那么字体名称必须使用引号包裹,设置的字体是否可用取决于用户机器上该字体是否可用...给英文,中文设置不同的字体 ---- 众所周知,font-family 属性的原则是客户端不支持前面的字体时,自动往后查找可以使用的字体 如果想要给英文,中文设置不同的字体,可以使用一个仅支持的英文的字体...(比如: Arial),再找一个支持中文的字体 如下所示: 遇到文字时,首选会尝试使用 Arial 字体,该字体支持英文,所以遇到英文会生效,遇到中文时 Arial 不支持,将自动使用后面的 Noto..." href="https://fonts.googleapis.com/css?...family=Noto+Sans+SC:100,300,400,500,700,900">C:100,300,400,500,700,900"> 在需要使用思源黑体的地方使用 CSS 设置字体 font-family
字体设置 <!...font-size: 80px; } 这是宋体 字体大小...1.直接写颜色的英文单词 color : red ; 2.通过十六进制表示 color : #ff0000 ; 3.通过rgb表示 color : rgb(...225,0,0) ; 其中,第二种和第三种表示的都是三原色:红,绿,蓝 数值越大,表示该颜色的分量越浓. 225,225,225就表示白色 0,0,0就表示黑色 <!...225); } 这是第一段话 这是第二段话 字体粗细
font-weight 字体粗细 属性 说明 对应值 norml 正常(默认值) 100 lighter 较细 400 bold 较粗 700 bolder 很粗 900 font-style 字体风格...属性 说明 normal 正常(默认值) italic 斜体 oblique 斜体 在这里,有些字体有斜体italic属性,但有些字体却没有italic属性,oblique是让没有italic属性的字体也能够有斜体效果...行高 letter-spacing 字母间距 word-spacing 词间距 字体样式针对的是“文字本身”的型体效果,而文本样式针对的是“整个段落”的排版效果。...首行缩进:text-indent:通常可以使用6个   来设置首行缩进,但是为了不冗余代码,我们建议使用text-indent来设置首行缩进,text-indent值应该是font-size值的...去除所有的划线效果(默认值) underline 下划线 line-through 中划线 overline 顶划线 具体对应效果: 大小写:text-transform:针对英文而言 属性 说明
03-CSS字体属性 CSS Fonts(字体)属性用于定义字体系列、大小、粗细、文字样式(如斜体等)。 3.1字体系列 CSS使用font-family属性定义文本的字体系列。...,根据先后顺序依次查看系统是否支持,若不支持则查看后一个,若全都不支持则使用系统默认的字体显示 实际开发中,字体设置常用于标签来将整个页面中的字体全部修改掉 3.2字体大小 CSS使用 font-size...,我们应尽量给一个明确值,而不要使用默认大小 同样可以通过给设置字号大小来指定整个页面文字的大小(标题标签除外,需要单独设定) 3.3字体粗细 CSS使用 font-weight属性来设置字体粗细...)、lighter(细体)、number(直接使用数字,不要加单位,相对于单词属性值,数字属性值更推荐使用) 3.4文字样式 CSS使用 font-style属性设置文字样式,属性值有normal(默认值...,必须按照上面语法格式中的顺序来写,不可以更换顺序,并且各个属性值之间用空格相隔 不需要设置的属性可以省略(取默认值),但必须保留font-size和font-family,否则font属性将不起作用
一 字体属性 1、font-weight:文字粗细 取值 描述 normal 默认值,标准粗细 bord 粗体 border 更粗 lighter 更细 100~900 设置具体粗细,400等同于normal...:一般是12px或13px或14px 注意: 1、通过font-size设置文字大小一定要带单位,即一定要写px 2、如果设置成inherit表示继承父元素的字体大小值。...非衬线字体 中文:宋体,微软雅黑,黑体 注意: 1、设置的字体必须是用户电脑里已经安装的字体,浏览器会使用它可识别的第一个值。...二 文本属性 1、text-align:规定元素中的文本的水平对齐方式。...CSS显示模式转换 属性 描述 值 display 可以通过标签的display属性设置显示模式 block 块级inline 行内inline-block 行内块级 4、div与span 布局都是用块级元素
字体样式 (双标签):没有任何语义的标签,通常和CSS结合使用。 font-family 设置字体类型 <!...} 浏览器显示 font-weight 设置字体的粗细 div span{ font-family: 宋体; font-size: 24px;...font-style:italic; font-weight:bold; } 浏览器显示 这样设置嫌麻烦还可以在一个声明中设置所有字体属性 浏览器显示 字体属性的顺序...:字体风格→字体粗细→字体大小→字体类型; 总结 font-family——设置字体类型——font-family:"宋体"; font-size——设置字体大小——font-size:12px; font-style...——设置字体风格——font-style:italic; font-weight——设置字体的粗细——font-weight:bold; font——一个声明中设置所有字体属性——font:italic
使用各种属性进行样式设置。 由于要使用的属性太多,因此任何初学者都自然会对使用哪个属性以及何时使用感到困惑。...在这一部分中,将讨论一种称为opacity的属性。...The same meaning of opacity holds in the CSS as well. let’s have a look! CSS中也具有不透明度的相同含义。...在CSS中, opacity属性倾向于设置元素的不透明度 。...注意: opacity属性的缺点是,如果将元素设置为透明的,则所有属性的子元素也将变为透明的。 如果要避免这种情况,并希望使文本在元素内可读,则应改为RGBA值 。
CSS 中 , 字号大小 设置 语法如下 : p { font-size:16px; } 上述代码的含义是 , 将 HTML 页面所有的 p 标签字号都设置成 16 像素 ; font-size...适配比较麻烦 ; 不同的浏览器的默认文字大小不同 , 尽量为每个 body 设置一个基本的默认字体大小 , 推荐在 body 中设置 16 px ; Google 浏览器默认文字大小 16 像素 ;...---- 1、 语法简介 CSS 文字 字体设置语法 : p { font-family:"微软雅黑"; } 常见的字体 : 微软雅黑 , 默认字体 ; 宋体 黑体 如果 指定了多个字体 , 如下样式...: 如果设置多个字体属性值 , 使用逗号隔开 ; 中文名称 的字体 , 使用双引号包裹 ; 英文名称 的字体 , 直接写上去即可 , 不必使用双引号 ; 如果 字体的 英文名称 中包含 空格 , #..., $ 等字符 , 则必须加双引号 或 单引号 ; 使用系统的默认字体 , 不要使用不常见的字体 , 保证浏览器适配 ; 2、 Unicode 编码字体名称 在 CSS 中 设置 中文名称字体 时 ,
---- 1、 按照文档层次查找 CSS 的使用方法可在 CSS 2.0 手册 中查询 ; 这里以 查询 font-weight 字体粗细设置 为例 , 在文档左侧的 " 属性 | 字体 | font-weight..." 中 , 可以找到该文档 ; 在右侧的 语法 和 参数 中 , 详细的说明了 属性的作用 , 以及 属性值如何设置 ; 2、 搜索关键字查找文档 此外 , 还可以在 CSS 2.0 手册的 搜索栏..., 搜索该属性 ; 二、 font-weight 字体粗细设置 ---- 1、 语法简介 在 HTML 中可以使用 b strong ( 推荐使用 ) 标签 , 实现 文本粗体显示 ; 如果 使用...标签 粗体显示 , 则可以使用 CSS 设置其 不加粗 ; 在 CSS 中 , 可使用 font-weight 设置 字体粗细 ; font-weight 属性值设置 : normal : 默认不加粗样式...---- 1、 语法简介 在 HTML 中可以使用 i em ( 推荐使用 ) 标签 , 实现 文本斜体显示 ; 如果 使用 标签 斜体显示 , 则可以使用 CSS 设置其 不倾斜 ; 在 CSS 中
二、css字体、文本属性 css学前小知识: 一张图片的打印出来的实际尺寸是由电子图片的像素和分辨率共同决定的,像素(Pixel)是指构成图片的小色点,分辨率(单位DPI)是指每英寸(Inch)上的像素数量...1.字体属性 a) font-size 设置字体的大小 取值方式:数字 + 像素单位px(像素就是一个长度单位) 示意图 ?...多学一招:(1)取值用偶数(2)默认是16px大小(3)字体有多大,看字体的高度 b) font-weight 设置字体的粗细 取值:normal 正常的(400)、bold加粗(700)、bolder...在实际工作中 用的最多的就是normal (不加粗)和bold(加粗) c) font-style 设置字体的风格 取值:normal 默认 显示标准的字体样式 italic 字体倾斜 示意图 ?...2.字体可以写多组,中间用逗号隔开,显示不了第一个,就找第二个显示 3.字体名称中如果有空格 # $ 这种特殊字符的时候需要添加上引号 中文字体也需要添加引号 2.文本属性 a) 文本修饰 语法:text-decoration
文本属性 color 设置文本颜色; div span{ color: red; } 浏览器显示 text-align 设置元素水平对齐方式; div...{text-align: center;} 浏览器显示看上图 text-indent 设置首行文本的缩进; div{ text-align: left;...:40px; } 下图为设置行高之后 下图为没有设置行高 text-decoration 设置文本的装饰; div{ text-align: left;...以上为常见的文本属性,更多的文本属性可以打开W3school进行详细学习。...注意:有部分属性不是所有的浏览器内核都能识别的了的,这里可以通过加上浏览器前缀来解决: IE浏览器是Trident内核,加前缀:-ms- Chrome浏览器是Webkit内核,加前缀:-webkit-
css中常见的布局问题中定位是比较难懂的一个点 比如relative和absolute定位 fixed定位与relative的关系 下面这个小demo演示一下fixed与父级子级同级的效果展示 这三个...div都是【fixed】属性,但你会发现父级的zindex这时压根没盖过子级的z-index 同级的情况下是会被遮罩住的。
本文重要内容 CSS的单位 字体属性 文本属性 定位属性:position、float、overflow等 CSS的单位 html中的单位只有一种,那就是像素px,所以单位是可以省略的,但是在CSS中不一样...font 字体属性 CSS中,有很多非布局样式(与布局无关),包括:字体、行高、颜色、大小、背景、边框、滚动、换行、装饰性属性(粗体、斜体、下划线)等。 这一段,我们先来讲一下字体属性。...css样式中,常见的字体属性有以下几种: p{ font-size: 50px; /*字体大小*/ line-height: 30px; /*行高*/...2、字体属性的说明: (1)网页中不是所有字体都能用,因为这个字体要看用户的电脑里面装没装,比如你设置: font-family: "华文彩云"; 上方代码中,如果用户的 Windows 电脑里面没有这个字体...文本属性 CSS样式中,常见的文本属性有以下几种: letter-spacing: 0.5cm ; 单个字母之间的间距 word-spacing: 1cm; 单词之间的间距 text-decoration
上次看zepto的init方法时,有一段属性设置的代码,先来看看其表现: if (isPlainObject(properties)) { nodes = $(dom) $.each...,一直很困惑,为什么实例化dom之后,对nodes进行属性设置会导致dom也有了属性设置的结果。...回想了一下,在javascript中,对象是引用,而不是赋值,而dom不是zepto对象就是Dom对象,假如是zepto对象的话,那么nodes其实就是dom,因为在zepto的init方法中,传入参数是...那么attr方法中,传入的回调函数,则是首先判断this的nodeType是否为1,nodeType可以参考这里nodeType。...若是,则调用setAttribute方法直接将传入的key-value对象设置为属性,否则就通过一个funcArg函数来设置其属性name的值。
让我们仔细看看规范: 开发者使用的字体名如果与用户使用环境中已有的某个字体名字相同,在使用样式表的文档中会有效覆盖底层字体。...这使得网页开发者可以自由的选择字体名称,而毋庸担心与给定用户环境中存在的字体名产生冲突。 规范中如此定义是因为选择出与每个用户环境不产生冲突的名字这件事想想就十分可怕!...我们再次参考下规范: local中放入的是一串特定格式的字符串,这串字符串用于唯一标识庞大字体族中的一套字体。...他们通过@font-face重命名了一系列 local,加入不同 font-weight的本地字体源来简化 font-family属性的值。...同样也不再需要在你的CSS中为 font-family属性赋其他杂乱的值了。简单而有效!
本篇文章主要介绍通过css为页面设置字体样式 1.注册字体 首先需要注册本地字体 @font-face { font-family: "MiSans-Normal"; src: url("...../style/fonts/MiSans-Normal.ttf"); } 2.设置字体 在需要使用的元素上使用font-family属性设置第一步中注册好的字体 .bodyBox { font-family...: MiSans-Normal; } 此处的font-family名字为第一步中注册时的font-family对应的值
sticky粘性定位 是css新增属性 其实就是以往我们做的fixed;当滚动条下拉到一定程度设置容器为fixed; 用图来演示: 常见场景:通讯录及头部工具条 Document <style type="text/<em>css</em>
前言 上篇文章主要讲述了CSS样式更改中的背景Background,这篇文章我们来谈谈字体设置Font&边框Border的基础用法。。...1.字体设置Font 1).字体系列 可用字体: Serif Sans-serif Monospace...small-caps 显示小型大写字母的字体。...风格和颜色,然后定义边框的其它属性。...参考文档:W3C官方文档(CSS篇) 二、总结 这篇文章主要介绍了CSS样式更改篇中的字体设置Font&边框Border设置,希望让大家对CSS样式更改有个简单的认识和了解。 看完本文有收获?
, 你可以在TextStyle的 fontFamily 属性中使用. asset 是相对于 pubspec.yaml 文件的路径.这些文件包含字体中字形的轮廓。...在构建应用程序时,这些文件会包含在应用程序的asset包中。 可以给字体设置粗细、倾斜等样式 weight属性指定字体的粗细,取值范围是100到900之间的整百数(100的倍数)....的BaseApp也在library中,所以最开始将字体文件放在了library中,然后在BaseApp的MaterialApp中设置了fontFamily。...但是在flutter web中(其他平台未测),通过上面设置全局字体后,发现TextSpan中的字体并未生效,还是系统字体。...所以不论是全局样式还是为Text单独设置的样式,只要不冲突就都会生效。 但是在TextSpan的源码中,发现并没有这一步操作,所以设置的全局字体对它不起作用。
content="width=device-width, initial-scale=1.0"> Document 核心:rgba代表红绿蓝透明,混合在一起的颜色...DOCTYPE html> div{ width:...; } 核心:往xy轴平铺到规定的盒子的范围内...我是文字我是文字 我是文字 我是文字我是文字 我是文字 我是文字 我是文字 我是文字 核心:不想滚动条随网页的滚动而滚动就设置
领取专属 10元无门槛券
手把手带您无忧上云