文章列表
HTML元素不可见的实现方法详解
1.1 display:none;方法
display:none;方法可使元素隐藏，并且不占据任何空间。
对设置了display:none;属性的元素的任何用户交互操作都不可能生效。此外，读屏软件也不会读到元素的 ...
CSS3 @font-face详解
1.1概述
@font-face是CSS3中的一个模块，主要是把自己定义的Web字体嵌入到网页中。
1.2语法规则
语法：
@font-face {
font-family: <yourWebFontName>;
src: <source> [<format>][,<source> [<format>]]*;
[font-weight: <weight>];
[font-style: <style>];
}
参数说明：
...
浏览器对字体格式的支持详解
1.1概述
不同的浏览器对字体格式支持是不一致的。字体的格式包括.tff、.otf、.woff、.eot、.svg五种格式。
1.2格式介绍
1.2.1 TureType(.ttf)格式
.ttf字体是Windows和Mac的最常见的字体，是一种RAW格式。支持这种字体的浏览器有【IE9+、Firefox3.5+、Chrome4+、Safari3+、Opera10+、iOS Mobile Safari4.2+】。
1.2.2 OpenType(.otf)格式
.otf字体被认为是一种原始的字体格式，其内置在TureType的 ...
移动端web页面的字型
1.1概述
在网页中，常用中文字体是微软雅黑作，但移动端系统 ios、android 等不支持微软雅黑。
1.2三大移动端系统的字体
1.2.1 ios 系统
默认中文字体是Heiti SC
默认英文字体是Helve ...
HTML行内元素和块级元素的转换
1.1 CSS display属性
行内→块级，display:block;
块级→行内，display:inline;
1.2 CSS position:absolube;属性
使行内元素转换为隐式的块级元素。position:absolute;使得元素脱离文档结构，拥有了盒子属性，但不占据任何文档流空间。对于多个行内元素使用该属性，则遵循“后来者居上”的原则。
1.3 CSS folat属性
使行内元素转化为隐式的块级元素，对内的话元素拥有了盒子属性，对外则还是行内元素的属性，不占据一行。
Font Awesome应用详解
1.1概述
Font Awesome提供可缩放的矢量图标，可以使用CSS所提供的所有特性对其进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。
Font Awesome的缺点是：对IE6等浏览器兼容性不是很好，不过最新版本(4.2.0以后的版本)和IE7完美兼容。
1.2本地使用
1.2.1推荐地址
下载并且提供查询功能的链接：http://fontawesome.io/icons/
1.2.2引用
1、下载完毕并解压后文件包括以下几个文件夹：
css — 字体的引入,图标基础样式,大小等。
...
js程序中$符号详解
$符号在php中是表示变量的特征字符， 在js中它也有很多作用。
1.1用来表示变量。
例：
var str='hello world !';
var $str='hello world !';
1.2在正则表达式中，匹配结尾。
1.3由于受prototype.js（框架，用于将一些常用的函数封装，方便操作）的影响，常用 $来表示一个查找对象的函数， 其实就是一个自定义函数，用$只是简单，与用其它字符是一样的。
例：
HTML代码
<div id='name'></div>
JS代码
$=function (id){
retu ...
Web前端常用CDN静态资源库
BootCDN资源库网址：http://www.bootcdn.cn
cndjs资源库网址：https://cdnjs.com
Win 7下IE11或其他版本无法卸载、无法重新安装问题的解决方法
在安装IE11的过程中，或人为中断IE11安装，或在安装过程中某些系统优化软件对该过程进行了干扰，导致IE11虽然安装上了但却不完整，有可能导致无法正常打开IE，或系统无法对IE11进行卸载或重新安装。
解决方法——强制卸载IE11
操作方法如下：
1、首先进入打开这个 C:\Windows\TEMP\ 文件夹，将里面的所有文件都清空了。
2、依次点击“开始”—“所有程序”—“附件”，右键点击“命令行提示符”，选择“以管理员身份运行”。
...
1.1Web前端学习网站
1.1.1国外网站
github网：https://github.com/
stackoverflow网：https://stackoverflow.com/
github上不光只是代码仓库，还有很多资源收集类型的项目。后来这些项目搞了一个不成文的规矩，统一都叫awesome-xxx，比如awesome-vue、awesome-webpack、awesome-react等等，上面的资料又全又质量。要搜任何框架的资源，都可以在github上搜awesome加它的名字。
1.1.2国内网站
绿叶学习网：http://www.lvyestudy.com/
菜鸟 ...
div元素按比例缩放的实现方法
某些场景下，窗口宽度缩放时，使得元素宽度自适应的同时，保证每个元素的宽高比例不变。
1.1利用CSS属性实现——padding-bottom属性
padding-bottom 有一个特性是当它的值是百分比形式时，百分比的基数是其所在元素的父元素的宽度而不是高度（同 padding-left 和 padding-right 一样）。
1、具体方法：
将元素的 height 设成 0，使得元素的高度等于 padding-bottom；
合理设置 padding-bottom 的值。
<body> ...
HTML img布局问题详解
1.1尺寸的设置
1.1.1设置方法
对于一个img元素，可单独地修改 width或者 height 属性来设置大小，同时图片的比例保持不变。即设置宽度为原来的一半时，图片的高度并不是保持原来的大小，而是相应的 ...
HTML中空格的实现方法详解
浏览器总是会截短 HTML页面中的空格。如果在文本中写10个空格，在显示该页面之前，浏览器会删除它们中的9个。如需在页面中增加空格的数量，需要使用 字符实体。即使是一个空格也尽量不要直接在页面中打，因为在大多数编辑器中空格是透明滴，很容易就被删掉；另外，HTML压缩时候，空格很可能被干掉！
1.1 space键直接输入
缺点：
浏览器在解析 HTML 时，会把连续的空格解析成一个。
1.2 使用HTML中的空格占位符
优点：
浏览器在解析 HTML 时，写几个空格占位符就占几个空格位。
缺点：
...
RGB颜色与HEX十六进制颜色的换算
1.1换算表格
如上述。
1.2换算方法
通过上述表格可发现RGB中的0对应HEX的00，1对应01……9对应09,10则对应0A，11对应0B……15对应0F,16对应了10。总共17对,除去一对特殊的0对应00,剩下的16对其规律：
RGB的数值是16乘以HEX的第一位加上HEX的第二位，不足两位数时在前面补0即可。
实例：
例1：
RGB(11,111,222)=#??????
11÷16=0余11 11对应B 前面补0 那么HEX的数据为0B
111÷16=6余15 15对应F 那么HEX ...
Web语义化详解
1.1概述
Web语义化主要包括：HTTP语义化、HTML语义化和CSS命名语义话。
1.2 HTTP语义化
HTTP语义化是针对HTTP协议的。主要包括path路径语义话和HTTP method语义话。
1.3 HTML语义化
1.3.1概述
对于HTML体系而言，Web语义化是指使用语义恰当的标签，使页面有良好的结构，页面元素有含义，能够让人和机器都容易理解。
语义化标签使浏览器搜索引擎更快的捕捉到标签的内容，也使维护人员更好的维护代码，看到标签就知道标签里面实现的业务。
1.3.2 HTML的作用
...