1. 程式人生 > >java工程師走向前端學習心路歷程(三)

java工程師走向前端學習心路歷程(三)

<div class="grid-5">
		<div class="mod-makeup-categories">
			   <div class="cell-header">
			       <h3><em class="orange">美容旗艦店</em>所有分類</h3>
			   </div>
			   <div id="categoriesMakeup" class="content"> 
			       <div class="obj-categories item-1st">...特色精品...</div>
				     <div class="obj-categories item-2st">...日韓暢銷...</div>
				     <div class="obj-categories item-3st">...國貨精品...</div>
				     <div class="obj-categories item-4st">...歐美暢銷...</div>
			   </div>
		</div>
</div>


其實這個柵格中有兩個mod,我們只拿出第一個mod來做點分析,解釋下,mod是grid下面一層的單位。像這類模組的樣式命名都是mod開頭的。class="mod-makeup-categories" 命名規則就是mod+“語義話的名字”class="cell-header",cell又是mod下面的一個單元,cell裡面才是我們要表達的東西,如這裡的“美容旗艦店,所有分類”class="obj-categories",可以看出,相同的屬性都用這個class來渲染。知道了他的佈局,那我們模仿他做一個同樣的東西出來

相關推薦

java工程師走向前端學習心路歷程

<div class="grid-5"> <div class="mod-makeup-categories"> <div class="cell-header"> <h3><em class="orange">美

前端】【html5/css3】前端學習之路CSS3 2D變形/CSS3 3D變形/CSS3瀏覽器字首

一、2D變形(CSS3) transform transform是CSS3中具有顛覆性的特徵之一,可以實現元素的位移、旋轉、傾斜、縮放,甚至支援矩陣方式,配合過渡和即將學習的動畫知識,可以取代大量之前只能靠Flash才可以實現的效果。 1.移動【  translate(x

elastic search&logstash&kibana 學習歷程Logstash使用場景和安裝部署

download ssa 技術 tar.gz 我認 搬運 OS last 文檔 Logstash基本介紹和使用場景 自我認為:logstash就是日誌的采集收集,日誌的搬運工,實時去采集日誌。讀取不同的數據源,並進行過濾,開發者自定義規範輸出到目的地。日誌的來源很多,如系統

前端學習之HTML1

HTML標籤學習 2018-10-31 記錄一下學習的網站 http://www.w3school.com.cn http://www.runoob.com/ 1 <!DOCTYPE html> 2 <html> 3 4 <head>

Spring 學習歷程

Bean容器初始化 基礎 org.springframework.beans org.springframework.context BeanFactory提供配置結構和基本功能,載入並初始化Bean ApplicationContext儲存了Bean物件,並且

推薦系統的學習歷程

專案申報之後,要做的就是發表一篇學術論文。其實我對這個毫無壓力,因為我已經做過了實驗,我只需要將實驗結果寫到論文裡面即可。 但是,我的老師突然告訴我,我申報了服裝推薦系統,那我的實驗也得是服裝的。換句話說,我的資料必須是服裝資料。 大資料時代,最值錢的東西就是資料。最難弄到手的也是資料。服裝評分

2018年9月-10月前端學習總結——佈局css

1.關於按鈕-使用偽類選擇器 :after/:before 引入情景 在製作一個“更多”的按鈕時,由於運營所填充的按鈕是圖片形式,上面的“更多”兩字隨圖片的縮放而失去正常比例,在介面中看著極為不協調以及虛化問題。於是將運營上傳的按鈕圖片重新上傳為不帶文字只有背景圖的按鈕圖片

python一行程式碼實現百度翻譯和有道翻譯結果獲取-----py學習爬蟲歷程

更新(18-6-2):利用requests庫只需一行程式碼就可以獲取結果,程式碼在最後前言:本文參考於https://blog.csdn.net/c406495762/article/details/59095864一.本節主要用到的知識1-1:urllib.request.

C語言學習歷程素數的輸出

眾所周知,素數的定義是除了1和本身能整除,其他不能整出的就是素數。 要輸出100-200之間的素數,我們可以知道,條件就是將100-200之間的數拿出來,將他與2到其本身的每個數求餘數,所以用內迴圈。然後每有一個餘數為0,則定義標誌位count++,然後檢測標誌位是否為0,

前端】【html/css】前端學習之路:標籤顯示模式display

標籤的型別(顯示模式)    HTML標籤一般分為塊標籤和行內標籤兩種型別,它們也稱塊元素和行內元素。1.塊級元素(block-level)    每個塊元素通常都會獨自佔據一整行或多整行,可以對其設定寬度、高度、對齊等屬性,常用於網頁佈局和網頁結構的搭建。總而言之就是比較霸

前端學習階段總結2

引用值和原始值 上篇文章提到了引用值和原始值,今天便要花些時間來刨析一下這兩個值: 原始值: 首先,先來說一下棧,棧的特點為先入後出。採用動態一維陣列來儲存棧。所謂動態,指的是棧的大小可以根據需要增加。 原始值位於棧內,也遵循先入後出的特點。重點是:賦值為copy

WEB前端學習 Day 2邊框

邊框是啥?上一次說到盒子模型裡面有border,這個邊框指的就是border, 比如說帶有弧度的,圓形的,帶有陰影的等。 那麼首先回顧一下盒子模型,盒子模型從裡到外分別是content,padding,border,margin。 分別是borde

小八——WebGL心路歷程2,一個基於Three.js的webGL程式解析

在上一篇文章中簡單地介紹了一個原生態的webGL小程式,但是通過一個例子下來,我發現原生的api對於初學者的我來說有些吃力,特別是在頂點著色器和片段著色器這兩大神獸上,我糾結了十分長的時間。那麼,這個世界上總有那麼一些人,會為人類的進步無私地奉獻。在碼農界,這些大神會幫我們

hadoop生態系統學習之路java實現上傳檔案本地或ftp至hdfs

在上一篇博文中,我們講了如何編寫、執行、測試一個MR,但是hdfs上的檔案是手動執行命令從本地linux上傳至hdfs的。在真實的執行環境中,我們不可能每次手動執行命令上傳的,這樣太過繁瑣。那麼,我們可以使用hdfs提供的java api實現檔案上傳至hdfs,

關於程式碼效率提升的方法心路歷程購物車

關於程式碼效率提升的方法心路歷程(購物車) 給為園友們,大家好,最近一直解決執行提速,分析老程式碼的邏輯並提出優化方案,在這個過程中發現了很多不好的習慣,導致很多程式邏輯執行效率低下,現在將其總結一下,如果大家覺得有參考意義,就看一下,如果覺得有問題,多多指點,如果覺得寫的不好,也勿噴,謝謝! 案例分析: 關

python學習之路使用socketserver進行ftp斷點續傳

def += __init__ con 不存在 不為 local 接收 class 最近學習python到socketserver,本著想試一下水的深淺,采用Python3.6. 目錄結構如下: receive_file和file為下載或上傳文件存放目錄,ftp_clie

Spring學習之路bean註解管理AOP操作

spec resource 自定義屬性 開始 java framework XML 方法名 jar包 在類上面、方法上面、屬性上面添加註解;並用bean來管理; 書寫方法:@註解名稱(屬性名稱=值) 第一步:導入jar包   導入spring-aop.jar(spri

JAVA面試必備的知識寶典

java數據類型相關java中int char,long各占多少字節?|類型|位數|字節數| |-|-|-| |short|2|16| |int|4|32| |long|8|64| |float|4|32 |double|8|64| |char|2|16|64位的JVM當中,int的長度是多少?Java 中,

小白學習安全測試——掃描工具-Nikto使用

sdn plugins 技術 use 開發 服務器 update 自動 網站目錄 掃描工具-Nikto #基於WEB的掃描工具,基本都支持兩種掃描模式。代理截斷模式,主動掃描模式 手動掃描:作為用戶操作發現頁面存在的問題,但可能會存在遺漏 自動掃描:基於字典,提高速度,但存

Java數據結構和算法——冒泡、選擇、插入排序算法

我們 逆序排列 pub 多少 img 目錄 http 最小 數據結構 目錄 1、冒泡排序 2、選擇排序 3、插入排序 4、總結   上一篇博客我們實現的數組結構是無序的,也就是純粹按照插入順序進行排列,那麽如何進行元素排序,本篇博客我們介紹幾種簡單的排序算