/* [CSS常用文本属性]
 * 1、字体、字号:
font-weight:字体的粗细,可选属性值:bold加粗  lighter细体  100~900数值(400正常,700 bold)
 
font-size:字体大小   **PX  **%(浏览器默认字体大小的百分比,绝大部分默认16px) 
 
font-family:字体族,设置字体。
>>>多个字体样式间用逗号分隔,浏览器解析时,会从左往右依次解析,选择可用字体。
>>>一般前面使用具体字体名称,最后一个使用字体族类名称。
    (常用字体族名称:衬线体serif 非衬线体sans-serif(常用) 等宽体Monospace)
>>>例如:font-family:Arial, 'Microsoft Yahei', sans-serif;
 
font-style:字体样式,正常(normal) 斜体(italic)
 
* font-variant:small-caps; 将字母转为小型大写字体。
 
(了解)font缩写形式:font-style font-variant font-weight font-size line-height font-family
>>> 使用注意事项 :
 ① 顺序必须严格按照上述顺序;
 ② 多个样式之间用空格分割,而且font-size/line-height 必须作为一对用/分割
 ③ font-size和font-family必须指定,其他样式不指定将采用默认样式显示;
>>> 例如:font:italic bold 75%/1.8 'Microsoft Yahei', sans-serif;
斜体 加粗 字号/行高   字体族(微软雅黑,非衬线字体族)
 
2、字体颜色:
color:字体颜色
opacity:透明度,0~1之间的数字。 调整时控件以及子控件均会透明,而使用rgba调整时,只会时本控件透明,子控件不会发生透明度变化。
 
3、行距、对齐等:
line-height:行高   ① 像素单位 48px ② 不带px 正常行高的倍数 ③百分数 同2
>>> 典型应用,调整控件中文垂直居中的方式:控件的height=控件的line-height
 
text-align:块级元素中文字的水平对齐方式 left center right
 
letter-spacing:字符间距,字与字之间的间距
                                                                                                                                                                                                                                                                                                                      
text-decoration:文本修饰 下划线underline、删除线line-through、上划线overline、none
 
overflow:控制超出范围文本的显示方式(auto 根据文字多少自动显示滚动条,scroll始终显示滚动条, hidden 超出范围文本隐藏) 可以通过overflow-x overflow-y分别设置水平垂直方向
 
text-overflow:设置多余文字的显示方式 clip裁剪掉 ellipsis省略号
>>>【重点】让每行多余文字显示省略号:
① white-space: nowrap; 如果是中文,需设置行末不断行
② overflow: hidden; 设置控件超出范围隐藏
③ text-overflow: ellipsis; 设置多余文本省略号显示
 
white-space: nowrap; 设置中文行末不断行显示
 
word-break: 浏览器默认在空格处断行,当一个单词长度超出范围时,会不断行显示, break-all 允许在单词内换行。
 
text-shadow:文本阴影,有四个属性值:
①水平阴影距离 必选,数值越大,阴影右移
②垂直阴影距离 必选,数值越大,阴影下移 
③阴影模糊距离 可选,数值越大,阴影越模糊。默认为0,不模糊
④阴影颜色 可选,默认为黑色
 
text-indent:首行缩进,可用像素值调整缩进大小
 
* text-stroke: -webkit-text-stroke: 0.2px #008000; 描边的粗细,描边的颜色

学习HTML5一周的收获4的更多相关文章

  1. 学习HTML5一周的收获1

    HTML5的基本结构 学习了title标签(显示网站名称),link标签(链接文件,可做网页美化) 快捷键:Ctrl+/ 注释 学习[meta标签] 1.charset属性:单独使用,设置文档字符集编 ...

  2. 大熊君学习html5系列之------Online && Offline(在线状态检测)

    一,开篇分析 Hi,大家好,给大家拜个晚年!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例,让大家一步一步的 ...

  3. 学习-HTML5

    @@ 学习HTML5发现对我们开发工作者来说要方便很多,它现在还在发展阶段,在未来肯定会是主流. 我们知道HTML5目的是取代HTML4.01和XHTML1.0标准,他希望能够减少互联网富应用(RIA ...

  4. 大熊君学习html5系列之------requestAnimationFrame(实现动画的另一种方案)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  5. 大熊君学习html5系列之------XHR2(XMLHttpRequest Level 2)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  6. 大熊君学习html5系列之------WebStorage(客户端轻量级存储方案)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  7. 大熊君学习html5系列之------History API(SPA单页应用的必备------重构完结版)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  8. 大熊君学习html5系列之------History API(SPA单页应用的必备)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  9. 学习HTML5必读之《HTML5设计原理》

    引子:很久前看过的一遍受益匪浅的文章,今天再次转过来,希望对学习HTML5的朋友有所帮助. 今天我想跟大家谈一谈HTML5的设计.主要分两个方面:一方面,当然了,就是HTML5.我可以站在这儿只讲HT ...

随机推荐

  1. 关于自己封装Web前端框架的思考和探索

    一.引言 首先这些年关于前端技术层出不穷,从最早的只用js做简单验证,到现在发现好像大前端已经无所不能了的感觉.特别是为了降低前端开发复杂度,涌现了一大批 的MVC/MVVM模式的前端框架,不停了刷新 ...

  2. JQuery动画animate的stop方法使用详解

    JQuery动画animate的stop方法使用详解 animate语法: 复制代码 代码如下: $(selector).animate(styles,speed,easing,callback) 复 ...

  3. 递归编译的Makefile的实现

    最近写了一个递归Makefile,目的是既可以实现子模块的单独编译,也可以不做任何修改就和整个程序的整体进行无缝衔接的编译.具体的思路是借助第三方文件,将子模块编译好的.o文件的路径自动写到confi ...

  4. 让EFCore更疯狂些的扩展类库(二):查询缓存、分部sql、表名替换的策略配置

    前言 上一篇介绍了扩展类库的功能简介,通过json文件配置sql语句 和 sql语句的直接执行,这篇开始说明sql配置的策略模块:策略管理器与各种策略的配置. 类库源码:github:https:// ...

  5. redis的配置详解

    redis 127.0.0.1:6379> CONFIG GET loglevel 1) "loglevel" 2) "notice" Redis 的配置 ...

  6. 开源半成品的Web版工作流模板设计器(基于AngularJS 2和Redux), 还在继续填坑中

    先上个图: 很多企业内部的应用都需要有个工作流平台(插件),无奈灵活方便好用且能够自行更改代码定制嵌入的实在不多,只好自己动手慢慢搞. https://github.com/shibamo/99-fl ...

  7. Android jni 编程3(对基本类型一维整型数组的操作)总结版

    主要学习资料:黑马程序员的NDK方法使用(生产类库so)              jni编程指南中文版(已上传至博客园) 博主文章(它使用的是VS和eclipse联合开发):http://www.c ...

  8. 提升iOS审核通过率之“IPv6兼容测试”

    作者:jingle 腾讯系统测试工程师 商业转载请联系腾讯WeTest授权,非商业转载请注明出处. 原文链接:http://wetest.qq.com/lab/view/285.html 一.背景 在 ...

  9. Spring应用上下文中Bean的生命周期

    Bean装载到Spring应用上下文的生命周期,如图: Bean在Spring容器中从创建到销毁经历了若干个阶段,每一阶段都可以对Spring如何管理Bean进行个性化定制,以下我们通过代码去验证生命 ...

  10. .c与.cpp的区别解析

    这几天在练习数据结构等知识的时候,有时遇见文件保存为c后缀则能编译通过,有时又是保存cpp后缀才能通过.对于这个都没能区分清,是自己的基本功问题,于是百度了一下.幸好有许多和我一样有问题的人. 其实简 ...