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