前端开发中字体图标的使用方式
作者: 日期:2017-12-10 点击: 281
前端开发中字体图标的使用方式
前端开发中字体图标的使用方式
浏览器内核 -moz-对应 Firefox, -webkit-对应 Safari and Chrome -o- for Opera -ms- for Internet Explorer 兼容写法1.css 内部 hack-（1）前缀 *、+ 、_ ———————— ie6 *、+ —————————— ie7 * ———————————— ie8 *> ————————————firefox -（
在页面上，经常可以看到一段文字是以摘要这种表现形式展示，那么文字怎样截取才是合适的呢，超出部分的文字又该如何处理，一般都是以省略号（…）的形式处理，这样用户也会知道后面还有后续内容，比较符合语义，也有比较高的用户体验。那么和单行文本处理一样，用javascript或者其他语言处理，会受到不同字体字符不同的影响，而影响展现形式，所以我们可以使用CSS的 方式进行控制，下面我们就一起来学习一下吧！
这个标题其实已经是一个老生常谈的问题了。很多时候，比如网站最基本的文章列表，标题会很长，而显示列表的区域宽度却没有这么宽，这时候最正常的做法就是 让超出宽度的部分文字用省略号(…)来表示。通常做法是网站后台程序截取一定的字符然后输出到前台显示或者前台用javascript截取一定的字符，但 是通过控制字数来截取的话还是存在一个大问题的，因为中文和英文的字符宽度问题，这个字数不好控制，而且通用性较差。那么有没有更好的方法呢，比如直接用 CSS来解决的，当然是有的。
在平时项目中，大家可能有这样的体会，项目规模越大，css代码就会越多，css代码如果没有进行优化和维护，就会复杂加错，向一个乱了的毛线团，找不到开始的位置，这对于以后的维护工作来说，是不利的，你不晓得修改了这行代码，会不会对哪一行产生影响。
BFC这个东西说常见的话你可能不觉得，但是你肯定会常用到，也许你在用的时候也没想到BFC这东西。那它究竟是什么呢，我们来一起看一下。 官方给出的BFC解释是这样的，浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, table-cells, 和 table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们的内容创建新的块级格式化上下文。 在一个块级格式化上下文里，盒子从包含块的顶端开始垂直地一个接一个地
HTML 表单用于搜集不同类型的用户输入 HTML 表单用于收集用户输入； form 元素定义 HTML 表单。<form> form elements </form> Action 属性action 属性定义在提交表单时执行的动作。 向服务器提交表单的通常做法是使用提交按钮。 通常，表单会被提交到 web 服务器上的网页。 如果省略 action 属性，则 action 会被设置
HTML Input 属性 value 属性value 属性规定输入字段的初始值： <form action=""> <input type="text" name="name" value="珠峰培训"> </form> readonly 属性readonly 属性规定输入字段为只读（不能修改）： <form actio
自然布局 遵循元素自身的特性，在整个页面中，按照html的书写顺序，块级元素从上到下排列，行内元素从左到右排列，宽度达到最大值会自动折行。 浮动布局/流动布局 通过浮动float这个属性，改变元素的排列方式，可以让所有的元素在一行显示。 层布局 通过定位的属性，改变元素的位置，让元素层叠显示。 文档流 元素遵循自身的属性，根据html的书写顺序，块级元素从上到下排列，行内元素从做到右排列，宽度达到最大值会自动折行。
css盒子模型什么是盒子模型在浏览器看来，所有网页元素本质上是许多盒子排列在一起或者相互嵌套的。所有的页面元素都可以看成一个盒子，占据着一定的页面空间。一般来说这些占据的空间往往要比单纯的内容大，比如盒子与盒子之间都是有距离的。我们可以通过调整盒子的宽度、高度、边
css的优势 内容与表现分离 网页的内容统一，容易修改 丰富的样式，使得页面布局更加灵活 减少网页的代码量，增加网页的加载速度，节省网络带宽 运用独立css文件，有利于网页被搜索引擎收录 css选择器: css选择器：指定一个或多个标签，为其添加样式 css的一个核心就是能对多个元素应用某些相同的样式
html的基本结构 HTML结构标签描述 我们知道：HTML的结构如下：
下面对结构进行一一说明： html：定义整个HTML文件 head：定义HTML文件的头部信息 body：定义HTML的内容信息 以上的这几对标签在文档中都是唯一的，head 标签和 body 标签是嵌套我们用html主要用来填充页面中的内容，那css有什么作用呢？css主要用来美化页面，调整页面结构的。在html中，文本的样式可以使用一写特定的标签，比如粗体用,也可以直接在标签内部调整标签的大小，但是样式散落在html标签中，使得内容和样式的代码混杂在一起，难以区分。解决的方法就是改用---CSS;我们将html和css分离，有利于对内容进行统一的样式设置和修改。
没有标签我们一样可以向html页面添加内容，还可以做特殊的选择，怎么做到的呢，就是我们的css伪元素，现在伪元素已经相当常用了，那么今天我们就一起学习一下css的伪元素使用
在css中可以通过一些属性来设置元素的外边缘样式，那么我们现在就来介绍一下如何进行外边缘的设置
总结一下html标签以及html标签的分类、和html属性、html属性的格式，有问题欢迎提出，大家一起学习吧~
CSS伪类是用来添加一些选择器的特殊效果，通过这些选择器可以灵活的选择元素和元素的状态，让开发速度更快，选择性更多。
CSS 中常用的值和单位：CSS 属性是由属性名和属性值组成的，属性名规定了修改什么，而属性值是给定了具体的样式。那么这些值有些是特定的有意义单词，有些是具体的数值，下面我们就来介绍一下这些内容。
基线对齐是指行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐方式。
display规定了很多元素底层属性的东西，通过对元素display属性的控制，可以很好的进行布局编写，无论是固态布局还是自适应布局。
很多时候在编辑css样式的时候，多多少少会遇到一些冲突问题。有些时候这些冲突是因为你给一个元素多个相同属性，但属性值不同，有些时候是因为css属性自带的继承问题，那么今天我们就来详细聊聊css属性的继承...
页面中的文字是页面的主要组成之一，所以很多时候我们在考虑文字的各种显示形式，那么今天我们就看一下，利于css2和css3提供的属性来简单的控制一下文字样式
要使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。 “选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素，css选择器可以批量选择元素和区分元素，大大提高了代码的维护工作和工作效率
html将网页的结构搭建起来，那么剩下的事情就是将我们的房子装修一下了，css层叠样式表就是我们精心装潢的工具和材料，那么本次我们一起来了解一下css的基础部分，有一个初步的认识
CSS 背景这里指通过CSS对对象设置背景属性，如通过CSS设置背景各种样式。
css中有很多居中的方法，接下来给大家介绍一下常用的几种居中的方法
在做前端开发的时候要记住：HTML告诉我们一块内容是什么（或其意义），而不是它长的什么样子。当我们提到“语义标记”的时候，我们所说的HTML应该是完全脱离表现信息的，其中的标签应该都是语义化地定义了文档的结构。
网页的内容需在标签中，标题、字符格式、语言、兼容性、关键字、描述等信息显示在
标签中，而网页需展示的内容需嵌套在标签中。所以html标签是非常重要的知识点，今天就单独和大家分享一下html标签及其分类吧！html基本结构就像是房子的骨架地基一样重要，没有这些任何内容都得不到很好的显示，这样的页面用户打开就会关上，根本没有价值，那么为了避免这些，我们今天就来详细的看看html的基本结构吧！......
去除超链接的虚框的一些方法 1. a{ blr:expression(this.onFocus=this.blur());/*IE使用*/ outline-style:none;/*FF使用*/ } /*去除a标签带来的虚框*/ 2、全 局控制
腾讯实习生网页重构组招聘公开试题（含答案）,这些题很靠谱，可以做为网页前端开发的面试题或学生的测试题【CSS面试题,网页前端开发面试题,网页制作考试题】 一、 耐心填一填！（
1.在IE6下无法定义小高度的容器，是因为有一个默认的行高。列举2种解决方案：overflow:hidden或line-height:02.将img定义为display:block,或定义父容器为font-size:0，个人更推荐
DIV＋CSS网页布局这是一种趋势,我也开始顺应这股趋势了,不过在使用DIV＋CSS网站设计的时候，应该注意css样式兼容不同浏览器问题，特别是对完全使用DIV+CSS设计的网页，就应该更注意IE6 IE7 FF对CSS样式的兼容.
CSS HACK的方法 首先需要知道的是： 所有浏览器 通用 height: 100px; IE6 专用 _height: 100px; IE7 专用 *+height: 100px; IE6、IE7 共用 *height: 100px; IE7、FF 共用 h
每个人都可以编写CSS代码，甚至你现在已经让它为你的项目工作了。我们在52CSS.com中也一直与大家讨论，学习CSS编码与CSS技
A：行内就是在一行内的元素，只能放在行内；块级元素，就是一个四方块，可以放在页面上任何地方。 B：说白了，行内元素就好像一个单词；块级元素就好像一个段落，如果不另加定义的话，它将独立
所谓标签语义化，就是指使用正确的标签表达合适的网页内容 正使用HMTL标记，才能使网页有内涵，才能让网页达到优化 正确的HTML布局，是尽可能的使用正确的标记来表达合理的内容，尽量
1 . id和class命名采用该版块的英文单词或组合命名，并第一个单词小写，第二个单词首个字母大写，如:newRelease 2 . CSS样式表各区块用注释说明 3 . 尽量使用英文命名原则 4 . 不
hack书写规范：IE6、IE7、Firefox之间的兼容写法 IE都能识别*;标准浏览器(如FF)不能识别*； IE6能识别*，但不能识别 !important, IE7能识别*，也能识别!important; FF不能识别*，但能识别!important; 根据上述表达，同一类/ID下的CSS hack可写为： .searchInput {background-color:#333;/*三者皆可*/ *background-color:#666 !impor
实现这个要求在FF和IE8里是很简单的，用CSS属性的min-height:100pxt; height:auto就可以了，但是在IE6里是不行的，IE6不支持min-height这个属性。但IE6有个BUG，就是如果指定了一个盒子的高度，但里面内容又溢出了，那这个高度则会失去作用，高度会随着内容的增长而自动增长，这和min-height:100pxt; height:auto的效果是一样的。但在IE6以上的版本和火狐里，height这个属性没有这个BUG，如果在高度的方向内
地址：北京昌平区科星西路106号院国风美唐综合楼6号楼505珠峰培训
课程内容版权均归 北京珠峰世纪技术培训有限公司 所有
北京珠峰培训店内纠纷和解员：周啸天 电话：18310612838 | 
霍营市场监督管理所投诉举报电话：010-60787760 | 营业执照
电话：400-180-6960 | 京ICP备09041920号 | 京公网安备110108400531号
