学习HTML5一周的收获4

/* [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; 描边的粗细,描边的颜色

时间: 2024-10-06 00:29:13

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

学习HTML5一周的收获1

HTML5的基本结构 学习了title标签(显示网站名称),link标签(链接文件,可做网页美化) 快捷键:Ctrl+/ 注释 学习[meta标签] 1.charset属性:单独使用,设置文档字符集编码格式. >>>写法:<meta charset="UTF-8"> >>>常见的中文编码格式: GB-2312:国标码,简体中文 GBK:扩展的国际码,简体中文 UTF-8:万国码Unicode码,基本兼容各国语言 2.http-equiv属

学习HTML5一周的收获3

[form] 1.两个属性 action:表单提交的服务器地址 method:数据使用的方法.get/post >>>get和post的区别 get传参数使用URL传递,所有参数可见,不安全:get传参数量数据有限: post传参数使用http请求传递,较安全,post可传大量数据 但是前者传递的速率大于后者 >>>URL传参数的形式,链接URL地址?name1=value1&name2=value2 2.input的常用属性 type:设置input的输入类型

学习HTML5一周的收获2

超链接 a 1.herf:超链接的网络地址,可写本地文件的相对路径,或本地html文件的相对路径, 方式是img的src的路径 2.target:设置超链接打开窗口的位置,_slef 自身网页打开(默认) _blank 新页面开 3.title:鼠标指上弹出 [功能性链接] mailto://[email protected] tencent://massage/?uin=2831705549 [锚链接] 1.本页面锚链接 设置一个锚点:<a name="top"><

PHP语言学习之html5的学习,一周总结

通过这周的html5的学习我整理了一下一些东西和一些总结 写代码的时候也开头都要对齐这样开起来很舒服,这些都是用到缩进键搞定的,比如<html></html>在一块写,要前后对齐,这样容易发现错误,而且看起来比较清晰 写代码是还有英文和中文的标点符号的问题,这些都要是注意的,(这基本是我在学习的时候遇到的问题) 要掌握好重要的标签,这样能够更好的学习.... 开始学习html 5 什么是html5HTML是由W3C的维护的 HTML是大小写不敏感的,HTML与html是一样的 HT

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

一,开篇分析 Hi,大家好,给大家拜个晚年!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例,让大家一步一步的体会"h5"能够做什么,以及在实际项目中如何去合理的运用达到使用自如,完美驾驭O(∩_∩)O~,好了,废话不多说,直接进入今天的主题, online,offline 事件用来监测浏览器处于在线或离线状态.HTML5提出的离线存储,web应用程序可以在不连接互联网的情况下满足用户的部分需求,

蓝鸥零基础学习HTML5—html+css基础

蓝鸥零基础学习HTML5-html+css基础 一.课程目标 1.了解前端开发职位:2.掌握常用标签以及语义及用法:3.掌握常用css的特性,掌握基础布局技巧:4.掌握整站规划概念. 二.适用人群 零基础积极学习html5者 三.课程简介 本课程主要讲解了 html+css的基础知识,包括html模板.标签.css基础样式.布局.表格表单.整站等等,是进行前端开发的基础.Html+css是前端开发的基础,大部分前端开发工程都需要从html+css布局开始,html+css的基础非常重要,是前端开

学习HTML5之类的前端技术的好方法!

今天学习HTML5,把网上的部分知识点复制到记事本里时,忽然醒悟,干嘛不把记事本改成HTML呢,还能随手进行新知识新操作的实践! 虽然比起针对知识点去实践有点麻烦,但是这样学习的时候,复习到了很多几乎快要忘记的东西,比如&.<.>.空格的转义字符,一下子熟练了很多2333 而且还有个好处,能练习各种文章格式的排版,对于有点强迫症似的我来说,直接复制粘贴一大段话到一个p标签里,我是绝对无法容忍的!哈哈!

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

一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会"h5"能够做什么,以及在实际项目中如何去合理的运用达到使用自如,完美驾驭O(∩_∩)O~,好了,废话不多说,直接进入今天的主题, 今天主要讲的是对昨天文章中的代码进行重构,并且相应的美化了一下前台UI界面,如下图所示的效果: 哈哈哈酷吧!继续让咱们做个简单的回顾: 为了提高Web页面的响应速度,越

提要求,学习html5,完善自己的个人网站,体会不一样的现实心情

2016年6月5日,我睡不着,在这里,思考,思考自己的人生,也总结自己在这两年来的所有的成就,转眼22岁了,从自己当时选择从学校出来,到现在.我的整个人生啊,发生了翻天覆地的变化. 从学校当时的初心,到2016年5月29日,被现实磨到与女朋友分手,而分手的最后,什么也没有留下,就留下了一些自己的不成熟,眼看着所有的一切,都全完了.一切什么都没有了,当时自己的计划, 定了的时候,自己许下诺言的时候,自己打算开始认真追求,认真去开始自己的长跑路线的时候,而现时给自己留下的,只有自己内心的崩溃.唯独美