补充9.27----9.28

1.为什么使用雪碧图?

因为我们使用雪碧图之后,本来需要多次请求的图片,我们一次就请求过来了,然后使用background-position调位置,从而减少了该页面向服务器请求的次数,间接的优化了该页面的性能。

2.如何实现浏览器title中的小图标

首先我们需要借鉴link标签

link标签: rel   type   href

  rel 是当前页面和url之间的关系  rel=”stylesheet”

  type 是资源文件的mime类型  .html文件mime类型是text/html 图片的mime类型

  Image/jpg(png/gif)  css的mime类型是text/css js的mime类型是text/javascript。

  mime类型,客户端和服务器之间的暗号,根据拓展名而定

  <link rel="shortcut    icon"   href="favicon.ico"/>(这样title中的小图标就出来啦)

,3,矢量图标 http://www.iconfont.cn/(阿里云矢量图库。)

  Meta 元信息标签(分析里面的属性)

  转义字符(空格的字符 &nbsp;)

4.项目的完整目录

  CSS

  images

  js

  index.html

5.textraea{

      resize:none;

}(这个属性不让文本域被人拉伸)

6.table{

    border-collapse:collapse;

}(这个属性让表格的边框变细)

7.font的缩写

font:12px/150% arial, verdana,"\5b8b\4f53";(字体的大小、字形、字体格式、)

color:#fffffff;

8.清除浮动的兼容性

.clearfix:after{
content:'';
display: block;
clear: both;
height: 0;
visibility: hidden;
}

.clearfix{

    *zoom:1;

}清楚浮动在低版本浏览器不像,需要处理兼容性;加一个clearfix{*zoom:1;)

9.

9.光标的形状

cursor 光标属性值有 pointer 抓手\指针   wait 转圈  help问号  crosshair十字架  deflault箭头

10.rgb 和rgba和opacity

Rgb(  )颜色的表示方法值是{  0-255如background:rgb(12,15,16);  }

Opacity表示透明度 值是0-1;

opacity:.5;

filter:alpha(opacity=50)这是IE低版本透明度兼容的方法。

rgba(  ) r是red 0-255 g是green 值是0-255 b是blue值是0-255 a是opacity值是0-1;(但是ie低版本不支持。)

background:rgba(12,15,126,16);

11.Rgb和opacity  与rgba的区别?

前者的内容也跟着透明,后者的内容不跟着透明。内容包含图片和文字

9.28

1.transparent(透明的)

2.placeholder(占位符)

写页面

1.搞清结构乘次

2.保证模板化,让他们之间不能互相受到影响;

  (1)元素性质

  (2)标准流

注意: 浮动带来的脱离文档流撑不起父级的高度的问题可以采用清除浮动的方式消除影响,

absolute和fixed带来的脱离文档流撑不起父级的高度,使用子元素设置高强制撑起父级。

posted @ 2018-09-28 19:56  前端开创者123  阅读(109)  评论(0编辑  收藏  举报