前端非常有意思的小技巧

hiyang 發(fā)布于2019-04-23 11:43 / 2762人閱讀

摘要：這是我在工作和學(xué)習(xí)中總結(jié)的一些平時(shí)不怎么常用但是很實(shí)用的方法技巧部分盒子實(shí)際大小設(shè)置超過兩行就出現(xiàn)省略號(hào)強(qiáng)制換行文字溢出隱藏鼠標(biāo)設(shè)置為移動(dòng)效果鼠標(biāo)設(shè)置為小手效果段落中的文本不換行平面轉(zhuǎn)立體移動(dòng)端取消點(diǎn)擊效果用繪制三角形使用來控

這是我在工作和學(xué)習(xí)中總結(jié)的一些平時(shí)不怎么常用但是很實(shí)用的方法技巧:

CSS部分:

　　1.盒子實(shí)際大小設(shè)置

　　2.超過兩行就出現(xiàn)省略號(hào)

　　3.強(qiáng)制換行

　　4.文字溢出隱藏

　　5.鼠標(biāo)設(shè)置為移動(dòng)效果

　　6.鼠標(biāo)設(shè)置為小手效果

　　7.段落中的文本不換行

　　8.平面轉(zhuǎn)立體

　　9.移動(dòng)端取消點(diǎn)擊效果

　　10.用CSS繪制三角形

1 .sign {
2   width: 0px;
3   height: 0px;
4   border-width: 10px;
5   border-style: solid;
6   border-color:#FF3333  #FF3333  transparent transparent;
7 }
/*使用border-color來控制你想要的形狀,transparent為透明*/

/*使用transform來控制你想要的形狀*/

transform: rotate(90deg); /*順時(shí)針旋轉(zhuǎn)90°*/

JS部分:

　　1.時(shí)間戳轉(zhuǎn)換格式封裝

　　2.原型對(duì)象賦值注意

　　3.js跳轉(zhuǎn)

　　4.Vue中的路由對(duì)象

　　5.服務(wù)器重定向

　　6.改變url標(biāo)識(shí)

其他類型:

　　1.關(guān)于 json格式轉(zhuǎn)換

　　2.移動(dòng)端設(shè)置rem

　　3.服務(wù)器支持cookie的跨域

　　4.H5解決IE兼容

　　5.Array.of()把一串?dāng)?shù)字轉(zhuǎn)化為數(shù)組

GPU云服務(wù)器云服務(wù)器 c語言有意思的小程序前端技巧前端開發(fā)技巧前端的意思

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/1062.html

相關(guān)文章

HTML-CSS-JS

摘要：本周于上海閉幕，掘金和知乎上都有對(duì)應(yīng)的實(shí)錄和問答，但會(huì)議的視頻目前都還沒放出來，有心的同學(xué)如果找到了歡迎分享。建議中英文對(duì)照閱讀。英文原文前端獨(dú)立技術(shù)博客推薦推薦一些現(xiàn)在還在堅(jiān)持原創(chuàng)的博主，有業(yè)界大牛，也有小鮮肉，也有國(guó)外美女。 CSS 樣式書寫規(guī)范最佳實(shí)踐本文的所列是實(shí)踐當(dāng)中得出的一套比較不錯(cuò)的 CSS 書寫規(guī)范，可以結(jié)合自身團(tuán)隊(duì)發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...

mikasa 2019-08-01 18:18 評(píng)論0 收藏0
HTML-CSS-JS

摘要：本周于上海閉幕，掘金和知乎上都有對(duì)應(yīng)的實(shí)錄和問答，但會(huì)議的視頻目前都還沒放出來，有心的同學(xué)如果找到了歡迎分享。建議中英文對(duì)照閱讀。英文原文前端獨(dú)立技術(shù)博客推薦推薦一些現(xiàn)在還在堅(jiān)持原創(chuàng)的博主，有業(yè)界大牛，也有小鮮肉，也有國(guó)外美女。 CSS 樣式書寫規(guī)范最佳實(shí)踐本文的所列是實(shí)踐當(dāng)中得出的一套比較不錯(cuò)的 CSS 書寫規(guī)范，可以結(jié)合自身團(tuán)隊(duì)發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...

李世贊 2019-08-29 14:08 評(píng)論0 收藏0
HTML-CSS-JS

摘要：本周于上海閉幕，掘金和知乎上都有對(duì)應(yīng)的實(shí)錄和問答，但會(huì)議的視頻目前都還沒放出來，有心的同學(xué)如果找到了歡迎分享。建議中英文對(duì)照閱讀。英文原文前端獨(dú)立技術(shù)博客推薦推薦一些現(xiàn)在還在堅(jiān)持原創(chuàng)的博主，有業(yè)界大牛，也有小鮮肉，也有國(guó)外美女。 CSS 樣式書寫規(guī)范最佳實(shí)踐本文的所列是實(shí)踐當(dāng)中得出的一套比較不錯(cuò)的 CSS 書寫規(guī)范，可以結(jié)合自身團(tuán)隊(duì)發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...

MudOnTire 2019-08-21 18:25 評(píng)論0 收藏0
前端經(jīng)典文章

摘要：上周末看這篇文章時(shí)，偶有靈光，所以，分享出來給大家一起看看前端面試四月二十家前端面試題分享請(qǐng)各位讀者添加一下作者的微信公眾號(hào)，以后有新的文章，將在微信公眾號(hào)直接推送給各位，非常感謝。前端切圖神器 avocode 有了這個(gè)神器，切圖再也腰不酸，腿不疼了。這一次，徹底弄懂 JavaScript 執(zhí)行機(jī)制本文的目的就是要保證你徹底弄懂javascript的執(zhí)行機(jī)制，如果讀完本文還不懂，...

lowett 2019-08-22 13:58 評(píng)論0 收藏0
用測(cè)試工具JSLitmus來告訴你幾個(gè)提升JavaScript性能的小技巧

摘要：性能測(cè)試工具操作測(cè)試代碼測(cè)試結(jié)果黃條代表每秒可執(zhí)行測(cè)試函數(shù)的次數(shù)，當(dāng)然越多越快。務(wù)必減少操作，減少無意義的路徑的查找。其他測(cè)試測(cè)試代碼這些測(cè)試代碼來自，官網(wǎng)的例子這是一個(gè)空的非循環(huán)測(cè)試。正則表達(dá)式測(cè)試，數(shù)組的，新建日期，稍微慢了些。性能測(cè)試工具 JSLitmus dom操作測(cè)試代碼 ...

羅志環(huán) 2019-08-20 11:10 評(píng)論0 收藏0