本文章為簡單記錄TP6項目在啟用前的一些最基本的準(zhǔn)備工作,主要包括以下幾步: TP6項目安裝 在指定目錄下運行”composer create-project topthink/think tp” 多應(yīng)用的啟用:項目默認(rèn)為單應(yīng)用模式,實現(xiàn)項目中...
本方介紹幾個最基礎(chǔ)的comporser包(也即是說,這些包在常規(guī)項目中大概率都是用得上的,所以一般而言,在一個項目開始初,也就都做了自動安裝了) 1. ezyang/htmlpurifier 這個包,主要用來防范XSS攻擊的,尤其適合富文本...
一周的學(xué)習(xí),做個綜合使用看看效果,頁面效果圖如下: 整體大圖2.頭部設(shè)計3.媒體查詢,窗口小的時候自動調(diào)整fontsize并隱藏相應(yīng)元素 下面分項說明: 整體頁面結(jié)構(gòu)代碼折疊顯示如下: 注意點有以下: 在CSS代碼分為icon,me...
本課主要關(guān)于網(wǎng)頁基礎(chǔ)認(rèn)識部分 第一部分:頁面元素頁面為一個二維空間,所有元素的排列只有垂直和水平兩種方式,各元素的方式如下: 塊元素垂直排列,主要用來當(dāng)容器,最常見的元素就是DIV 行內(nèi)元素水平排列,主要為內(nèi)容項,最常見的元素就是 ...
在CSS選擇器中,在最基本的標(biāo)簽選擇器(div,P等)和屬性選擇器([],.class,#id)之外,稍微有點難度的就是位置選擇器:所謂位置選擇器就是根據(jù)已經(jīng)明確的選擇內(nèi)容通過一定的表示方法,選擇出其子代,后代,兄弟或后面的同級元素,以此來添加相應(yīng)顯...
偽類選擇器:根據(jù)元素的位置或狀態(tài)來匹配相關(guān)元素,相比標(biāo)簽/屬性/上下方選擇器相比,其最大的優(yōu)勢是,不用在原始的html文件上做額外操作. 結(jié)構(gòu)偽類:依據(jù)元素的位置來選擇核心結(jié)構(gòu)是:nth-child(an + b)an+b里,需要設(shè)置好a和b兩個值...
本文為第一課的核心知識點總結(jié),主要是關(guān)于前端開發(fā)環(huán)境搭建和網(wǎng)頁構(gòu)成的基本認(rèn)識,前者主要是瀏覽器chrome和編輯器VSCode 前端開發(fā)環(huán)境之瀏覽器chrome配置課上老師只是展示一下其檢查功能中的最基本一項,把一個網(wǎng)頁的結(jié)構(gòu)讓我們看的清清楚楚...
今天主要學(xué)習(xí)的是emmet的使用和簡單表單的制作,下課后主要思考點是,如何用emmet快速來寫出一個表單代碼來,成品效果如下: 基本代碼如下:
手機(jī)訪問原圖自己設(shè)計出來的 美工字體效果差距太大,只是簡單看看結(jié)構(gòu)吧. 整體頁面結(jié)構(gòu)說明分別引入iconfont,reset,和分結(jié)構(gòu)的CSS.body分為三部分獨立完成 其中注意在reset設(shè)置好隨手機(jī)端變化的自適應(yīng)rem并通過媒體查詢確保r...
最終效果圖如下: 主要功能和學(xué)習(xí)內(nèi)容與代碼展示 CSS的grid布局按鍵部分通過一個grid布局,快速完成了相應(yīng)的樣式 .calculator .buttons { display: grid; /* grid-template-columns...
先綜合說明一下,再來上代碼和效果 頁面結(jié)構(gòu)最常見的頁面結(jié)構(gòu)就是上中下也即三項,通過分別的CSS來將整個頁面做切隔,顯示代碼如下: