摘要： 过渡（transition)是CSS3中具有颠覆性的特征之一，我们可以在不使用 Flash 动画或 JavaScript 的情况下，当元素从一种样式变换为另一种样式时为元素添加效果。 过渡动画： 是从一个状态 渐渐的过渡到另外一个状态 可以让我们页面更好看，更动感十足，虽然 低版本浏览器不支持（ie 阅读全文

摘要： CSS3：background size 1、定义：background size属性规定背景图像的尺寸。 2、用法：background size：length | percentage | cover | contain 属性值： length：设置背景图像的高度高度和宽度。第一个值设置宽度，第 阅读全文

摘要： logo 里面 首先放一个 h1 标签 ，目的是为了提权，告诉搜索引擎，这个地方很重要 h1里面在放一个连接，可以返回首页的， 给连接一个 大小 和 logo 的背景图片 连接 里面要放文字（网站名称），为了搜索引擎收录我们。 但是文字不要显示出来 要用 text indent 移到盒子外面 （te 阅读全文

摘要： 图片是有诸多优点的，但是缺点很明显，比如图片不但增加了总文件的大小，还增加了很多额外的"http请求"，这都会大大降低网页的性能的。更重要的是图片不能很好的进行“缩放”，因为图片放大和缩小会失真。 我们后面会学习移动端响应式，很多情况下希望我们的图标是可以缩放的。此时，一个非常重要的技术出现了，额不 阅读全文

摘要： SEO是由英文Search Engine Optimization缩写而来， 中文意译为“搜索引擎优化”！ 常见的搜索引擎，比如百度，谷歌，雅虎，搜狗等等.. SEO是指通过对网站进行站内优化、网站结构调整、网站内容建设、网站代码优化等)和站外优化，从而提高网站的关键词排名以及公司产品的曝光度。 简 阅读全文

摘要： 1). 使用ico图标 首先把favicon.ico 这个图标放到根目录下。 再html里面， head 之间 引入 代码。 2). 制作ico图标 我们可以自己做的图片，转换为 ico图标，以便放到我们站点里面。 方法步骤： 首先把我们想要的切成图片。 要把图片转换为 ico 图标，我们借助于第三 阅读全文

该文被密码保护。 阅读全文

摘要： ~~~css div { width: 0; height: 0; line height:0； font size: 0; border top: 10px solid red; border right: 10px solid green; border bottom: 10px solid b 阅读全文

摘要： 1). 负边距+定位：水平垂直居中 咱们前面讲过， 一个绝对定位的盒子， 利用 父级盒子的 50%， 然后 往左(上) 走 自己宽度的一半 ，可以实现盒子水平垂直居中。 2). 压住盒子相邻边框 阅读全文

该文被密码保护。 阅读全文

摘要： 5.1 为什么需要精灵技术 图所示为网页的请求原理图，当用户访问一个网站时，需要向服务器发送请求，网页上的每张图像都要经过一次请求才能展现给用户。 然而，一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接受和发送请求，这将大大降低页面的加载速度。 我们为什么需要精 阅读全文

摘要： 4.1 white space white space设置或检索对象内文本显示方式。通常我们使用于强制一行显示内容 ~~~ white space: normal ；默认处理方式 white space: nowrap ；　强制在同一行内显示所有文本，直到文本结束，或者遭遇br标签对象才换行。 ~~ 阅读全文

摘要： 有宽度的块级元素居中对齐，是margin: 0 auto; 文字居中对齐，是 text-align: center; 但是我们从来没有讲过有垂直居中的属性。 vertical-align 垂直对齐，它只针对于行内元素或者行内块元素。 【对于块级元素无效。】 vertical-align : base 阅读全文

摘要： 所谓的界面样式， 就是更改一些用户操作样式，以便提高更好的用户体验。 更改用户的鼠标样式 (滚动条因为兼容性非常差，我们不研究) 表单轮廓等。 防止表单域拖拽 2.1 鼠标样式cursor 设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。 属性值 描述 default 小白 默认 po 阅读全文

摘要： 元素的显示与隐藏 目的 让一个元素在页面中消失或者显示出来 场景 类似网站广告，当我们点击关闭就不见了，但是我们重新刷新页面，会重新出现！ 1.1 display 显示（重点） display 设置或检索对象是否及如何显示。 ~~~ display: none 隐藏对象 display：block 阅读全文

摘要： 粘性定位sticky 粘性定位可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位，之后为固定定位。例如： #one { position: sticky; top: 10px; } 1. CSS 布局的三种机制 网页布局的核心 —— 就是用 CSS 来摆放盒子位置。 CSS 提供了 阅读全文

该文被密码保护。 阅读全文

摘要： “工欲善其事，必先利其器” Chrome浏览器不仅可以调试页面、JS、请求、资源、cookie，还可以模拟手机进行调试。我们现在只是使用html和css，我们先讲一下现在常用的调试。 2.1 怎样打开Chrome的开发者工具？ 直接在页面上点击右键，然后选择 “检查” 快捷键 F12 或者 ctrl 阅读全文

摘要： 为了提高网页制作的效率，布局时通常有以下的布局流程，具体如下： 1、必须确定页面的 版心（可视区） ， 我们测量可得知。【 公共类样式 】 2、分析页面中的 行模块 ，以及每个行模块中的 列模块 。其实页面布局，就是一行行罗列而成。 3、制作 HTML结构 。我们还是遵循，先有结构，后有样式的原则， 阅读全文

摘要： 建议遵循以下顺序： 1. 布局定位属性：display / position / float / clear / visibility / overflow（建议 display 第一个写，毕竟关系到模式） 2. 自身属性：width / height / margin / padding / bo 阅读全文