css/js(工作中遇到的问题)-3
生活随笔
收集整理的這篇文章主要介紹了
css/js(工作中遇到的问题)-3
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
設置寬高比
- 使用
padding/margin-top/bottom; - 設置出教準確的自適應布局;
- 用于預加載圖片;
關于數據庫設置
- 添加
extra對象用于擴展; - 添加
type類型;
對于字體
- 使用百分比繼承父類
- 使用
media進行適應
@media (max-width: 600px) {
html {
font-size: @w * 26px;
}
}
@media (max-width: 414px) {
html {
font-size: @w * 18px;
}
}
@media (max-width: 375px) {
html {
font-size: @w * 16px;
}
}
@media (max-width: 320px) {
html {
font-size: @w * 14px;
}
}
暫時的路徑跳轉使用302
- 設置302后瀏覽器會記錄，除非設置
cache否則會永久跳轉;
判斷滾動到頁面底部
if((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
console.log('test');
}
對于插入節點
appendChild只能插入Node類型;- 使用
insertAdjacentHTML插入字符串類型;
打印五星制
function getRating(rating) {
if(rating > 5 || rating < 0) throw new Error('數字不在范圍內');
return '★★★★★☆☆☆☆☆'.substring(5 - rating, 10 - rating );
}
最簡單的居中方式
- 垂直: 字元素 例子
{
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
- 水平: 父元素
{
text-align: center;
}
//
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
獲取函數的參數名稱
function getArgs(func) {
var args = func.toString().match(/function\s.*?\(([^)]*)\)/)[1];
return args.split(",").map(function(arg) {
return arg.replace(/\/\*.*\*\//, "").trim();
}).filter(function(arg) {
// 確保沒有undefineds
return arg;
});
}
undefined
.gitigonre文件
*.csv
*.dat
*.iml
*.log
*.out
*.pid
*.seed
*.sublime-*
*.swo
*.swp
*.tgz
*.xml
.DS_Store
.idea
.project
node_modules
npm-debug.log
直接用js修改樣式
div.style.setAttribute('style','height:100px');
毛玻璃效果
- 注意添加的對象:
filter: blur(xpx);
new Date的陷阱
- 在ES5之中，如果日期采用連詞線（-）格式分隔，且具有前導0，
JavaScript會認為這是一個ISO格式的日期字符串，導致返回的時間是以UTC時區計算的。
啟動nodejs程序注意
- 一些變量設置都要放在
start前面
NODE_ENV=production npm start;
時間格式處理
- ISO 8601 格式:
yyyy-mm-ddThh:mm:ss[.mmm];- T 表示后面是日期時間值的時間部分;
- 格林尼治標準時間
GMT; - 世界標準時間
UTC:yyyy-mm-dd|yyyy-mm-ddThh:mm:ssTZD
new Date('2015-12-12T00:00:00+0800');
new Date('2015-12-12T00:00:00+0800').toUTCString(); //UTC格式的格林尼治標準時間
new Date('2015-12-12T00:00:00+0800').toISOString(); //ISO格式的格林尼治標準時間
表單上傳的注意
let formData = new FormData(document.forms[0]);
//設置disable=false的input類型不會被添加到formData中
同時使用漸變和背景圖片
- 注意退化處理
body {
background-image: url(IMAGE_URL); /* fallback */
background-image: url(IMAGE_URL), linear-gradient(#eb01a5, #d13531); /* W3C */
background-color: #eb01a5;
}
簡單地設置字體自適應
function resize () {document.body.style.fontSize = document.body.clientWidth * 0.04 + "px"};
resize(); window.onresize = resize;
總結
以上是生活随笔為你收集整理的css/js(工作中遇到的问题)-3的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： goalng 将字符串转化成整数后取余
- 下一篇： 字符 kotlin(3)