小問(wèn)題集錦

20%的功能滿足80%的需求。愛(ài)、喜悅、和平。

1、怎樣該網(wǎng)站title加小圖標(biāo)

<link rel="Shortcut Icon" href="icon地址" type="image/x-icon">

　　

2、圖片縮放問(wèn)題

<div class="bg"><img src="images/section1.jpg" alt=""></div>

　　

錯(cuò)誤圖

錯(cuò)誤css

.section .bg { } .section .bg img { display: block; width: 100%; height: 100%;}

　　

正確圖

正確css

.section .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .section .bg img { display: block; width: 100%; height: 100%;}

　　

3、pc站自適應(yīng)移動(dòng)端

<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0" />

　　

4、定位

如何定位中間

<style>.go{position:absolute;left:50%;margin-left:負(fù)的寬度的一半;} </style>

　　

5、css3過(guò)渡(transition)

<style>transition: all 1s;-moz-transition: all 1s; /* Firefox 4 */-webkit-transition: all 1s; /* Safari 和 Chrome */-o-transition: all 1s; /* Opera */ <style>

　　

6、css3動(dòng)畫(huà)(animation)

7、抖動(dòng)

<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.jrumble.1.3.min.js"></script> <script> $(function(){//抖動(dòng)$('#download_btn').jrumble({x: 5,y: 5,rotation: 2});$('#download_btn').hover(function(){$(this).trigger('startRumble');}, function(){$(this).trigger('stopRumble');}); }); </script>

　　

官網(wǎng) http://jackrugile.com/jrumble/

8、瀏覽器兼容問(wèn)題

1、png8產(chǎn)生毛邊，png24、gif在ie6下無(wú)透明效果
解決方案：
(1)美工處理，使png8無(wú)毛邊（未測(cè)試）
(2)js判斷，檢測(cè)瀏覽器版本。ie6提示升級(jí) (3)js處理，通過(guò)js動(dòng)態(tài)選擇圖片

轉(zhuǎn)載于:https://www.cnblogs.com/xyws/p/5015881.html

總結(jié)

以上是生活随笔為你收集整理的前端小问题1——（最近好久没有发博客。。。待续）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。