原创 threejs 繪製地球、飛機、軌跡

首先我們來看下要實現的效果 這個縮小後的圖片,下面我們來看下近距離的動態效果。。 效果比較簡陋,需要後期再處理。。。 下面進入主題,代碼篇。。 HTML部分: <!DOCTYPE html> <html lang="en">

原创 深入理解網頁佈局中的display屬性

display屬性在網頁佈局中非常常見,但經常用到的僅僅是block、inline-block、inline和none等寥寥幾個屬性值,本文將詳細介紹display屬性的各個方面 定義 display屬性用於規定元素生成的框類型,

原创 CSS Hack實現瀏覽器樣式兼容的兜底辦法

CSS Hack是實現瀏覽器樣式兼容的兜底辦法,能不用就儘量不要使用。但是,針對一些瀏覽器的bug,比如老版本IE的bug,有時使用CSS Hack是不得已而爲之的做法。本文將詳細介紹CSS Hack。CSS Hack主要分爲屬性

原创 css3 實現大轉盤

效果 完整代碼 <!DOCTYPE html> <html lang="CN"> <head> <meta charset="UTF-8"> <meta name="keywords" content="關鍵字"

原创 CSS 細節難點綜合

對於CSS,要知其然,還要知其所以然。本文將介紹CSS各部分出現的原因,僅限個人理解,如有不妥,歡迎交流 Why CSS 早期的大多數網站標記幾乎完全由表格和font元素組成,且對於所要表現的內容不能傳達任何實際含義,使文檔可用性

原创 CSS佈局中的BFC

定義 在解釋BFC之前,先說一下文檔流。我們常說的文檔流其實分爲定位流、浮動流和普通流三種。而普通流其實就是指BFC中的FC。FC是formatting context的首字母縮寫,直譯過來是格式化上下文,它是頁面中的一塊渲染區域

原创 深入理解CSS計數器

我們對計數器已經不陌生了,有序列表中的列表項標誌就是計數器。 創建計數器   創建計數器的基礎包括兩個方面,一是能重置計數器的起點,二是能將其遞增一定的量。 counter-reset counter-reset:none;(默認

原创 input元素的23種type類型

隨着HTML5的出現,input元素新增了多種類型,用以接受各種類型的用戶輸入。其中,button、checkbox、file、hidden、image、password、radio、reset、submit、text這10個是傳

原创 零基礎想成爲一名專業的web前端開發程序員,需要學習什麼?

你有沒有看過你非常喜歡的網站,是否研究過它的佈局方式,有沒有想過我自己能不能也能實現一個,甚至比你看的網站更好! 所有這些可見的站點界面和特效都是通過前端開發構建的(有時也稱爲“前端Web開發”)。前端開發人員是一些最受歡迎的角色

原创 CSS選擇器

CSS的一個核心特性是能向文檔中的一組元素類型應用某些規則,本文將詳細介紹CSS選擇器 通配選擇器 星號*代表通配選擇器,可以與任何元素匹配 *{color: red;} 元素選擇器 文檔的元素是最基本的選擇器 html{co

原创 web前端入門必學的16個知識點

1、HTML常用標籤 語言是什麼 、Web前端開發語言、 HTML超文本標記語言 、 網頁主體結構 、常用標籤、超鏈接(a標籤)、Img圖片標籤 2、盒子模型 初探Div盒子模型 、css樣式、 簡單css樣式、盒子模型Bord

原创 使用餘弦定理製作磁盤形狀h5音樂播放器

功能實現 1、歌曲播放進度轉換成視覺的旋轉角度 2、點擊磁盤任意位置歌曲跳轉到相應進度 效果展示 原理說明 【1】旋轉原理 [外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片保存下來直接上傳(img-ICgHP287-1579

原创 理解CSS視覺格式化

CSS視覺格式化這個詞可能比較陌生,但說起盒模型可能就恍然大悟了。實際上,盒模型只是CSS視覺格式化的一部分。視覺格式化分爲塊級和行內兩種處理方式。理解視覺格式化,可以確定得到的效果是應該顯示的正確效果,還是瀏覽器兼容性的bug。

原创 web前端進階學習Node.js,你需要掌握什麼基礎?

Node.js是一個基於 Chrome V8 引擎的 JavaScript 運行環境,一個讓 JavaScript 運行在服務端的開發平臺,它讓 JavaScript 成爲與PHP、Python、Perl、Ruby 等服務端語言平

原创 CSS選擇器的新用法

現在,預處理器(如sass)似乎已經成爲開發CSS的標配,正如幾年前jQuery是開發JS的標配一樣。JS的querySelector借鑑了jQuery的選擇器思想,CSS選擇器也借鑑了預處理器的變量定義、選擇器嵌套、代碼塊重用等