測試技術貼

2021-10-02 01:12:46 字數 2572 閱讀 4649

前端主要分為三部分:html,css,js。

html:首先得了解標籤的含義,用在**,常用的用多了就知道了。另外h5也要去了解,對於h5的學習可以自己動手做乙個h5的動畫場景。這裡面涉及比較多的是css3樣式以及canvas。

css: 關於css還是推薦看書系統的學下。單看網上的,你可能只知道怎麼用,卻不知道他這樣用所隱藏的含義。還有就是容易產生混亂,所以還是建議看書系統學一學。有些概念還是要掌握的,不然面試很容易懵逼。

js: 這個是最複雜的。首先建議先看書了解基本語法。但是只看不動手是不行的。

關於css作用:

a.快速維護頁面元素的樣式屬性, 

b.彌補html元素的屬性不足 

css又被稱作層疊樣式表。 

關於css的元素屬性: 

一: 首先是長度單位:

a.寬度、高度用px(畫素),也可以用%(百分比)。建議使用固定值:; 

b.字型大小用pt(磅)表示 

其次就是顏色單位:a.顏色的直譯英文名稱,如:red(紅)、green(綠)、blue(藍)..... 

b.十六進製制表示法:#ff0000 

c.簡寫十六進製制:#f00 

d.rgb表示法:rgb(255,0,0) 

e.百分比rgb:rgb(100%,0%,0%) 

二: 1.寬度和高度: 

大部分元素都會用到這兩個屬性-------> width(設定寬度)、height(設定高度) 

例:; 

2.邊框: 

border屬性,設定邊框的寬度、線性、顏色  ......都有線性這個屬性,我們最多用到的無疑就是在和中了。 **(table)和盒子(div)因為看不到它的大小,我們一般都會用border設定顯示出邊框線 

例:; 

這樣我們可以看到乙個2個畫素的紅色實線出現在你的**中。這樣就可以清晰的看到**樣式了。 

在border中還可以給上下左右單獨設定邊框線: 

border-top:寬度 線型 顏色;border-bottom:寬度 線型 顏色; 

border-right:寬度 線型 顏色;border-left:寬度 線型 顏色; 

線性我們有三種:none(無)|solid(實線)|dotted(點劃線) 

3.內邊距 

就是設定**或者盒子內的邊距,可以設定單獨上下左右和邊框相同,這裡不列舉。

例:padding-top:5px;上側內邊距 

padding:5px;四個方向的內邊距都是5px 

padding:5px(上) 5px(左右) 5px(下); 

padding:5px(上) 5px(右) 5px(下) 5px(左); 

4.外邊距 

設定外部的邊距,可單獨設定上下左右。 

例:margin-top:5px;上側外邊距 

margin:0 auto;(讓外邊距為0,auto為網頁自動計算居中) 

margin:5px(上下) 5px(左右); 

margin:5px(上) 5px(左右) 5px(下); 

margin:5px(上) 5px(右) 5px(下) 5px(左); 

5.控制元素的顯示方式屬性 

可以控制元素不顯示,或者以什麼方式顯示出來。如果不顯示在此元素style中加入即可: 

例:dispaly:none(不顯示)|inline(內聯物件)|block(塊級物件); 

html的標記種類為----->內聯物件:不能自然換行 

塊級物件:可以自然換行 

預設為塊級物件: 

6.背景樣式 

可以設定背景,背景顏色,的平鋪方式,背景的位置 

設定背景樣式(哪個部分不需要可以忽略不用寫): 

例:background:背景顏色 背景 平鋪方式 水平位置 垂直位置 

a.背景顏色就是color,上面有書寫方式。

b.背景----> url(位址) 一定要寫 url 然後括號中寫上位址 

c.平鋪方式:no-repeat(不平鋪)|repeat-x(x軸平鋪)|repeat-y(y軸平鋪) 

d.水平位置(left|center|right) 

e.垂直位置(top|center|bottom) 

7.浮動樣式 

使**或者盒子中的內容全部靠左或者全部靠右,一把導航頁面都需要用到 

例:; 

8.文字樣式 

line-height:5px;設定行高 

text-indent:99px;設定首行縮排--------->首行縮排一般用於把按鈕上的文字向後隱藏。 

text-align:left|center|right;設定水平對齊方式 

cursor:pointer;設定瀏覽器中滑鼠形狀 

font-weight:normal|bold;設定文字加粗效果 

text-decoration:none|underline;設定文字下劃線樣式----->一般用於把超連結的下劃線取消 

9.列表樣式 

list-style:樣式 url(位址) 位置(inside|outside); 我們一般只設定一項,就是樣式,其餘可以忽略不寫。 例:list-style:none;把列表前面的實心圓或空心圓取消。用於ul,ol。 

吐槽專業貼,無關技術

吐槽是一種有益身心健康,可以釋放工作壓力的好東西。2016年8月9日 裝系統的程式設計師 告訴我,我真的是寫軟體的,不是裝系統的。唉,老闆,你開心就好。2016年8月10日 我和聯絡有仇 我肯定是和聯想不相容。從上大學到現在,裝過系統的電腦少說也有 一 二百臺了,但是裝系統裝到想砸電腦想打人的,就只...

技術崗結貼 準備轉行

寫這貼,是因為我要準備轉行了,結個技術貼吧。2020年9月30日是我嵌入式生涯的最後一天了吧,估計以後也不會回技術崗寫 了。1.先簡單介紹下個人基本情況 本人2019年6月28日普通本科畢業,不是什麼985,211高校高材生,自動化專業,大學期間主攻plc,西門子系列的。2.再簡單介紹下個人工作經歷...

技術貼 怎麼備份雙系統

裝了雙系統之後最痛苦的莫過於分別備份兩個系統了,大家以前都是用深度一鍵還原v5.11進行備份。今天我也是用這個,結果沒有考慮到我的第二個系統根本不可能備份上。於是乙個很偶然的靈感解決了我的問題。look 1.進入你的第乙個系統。一定得是第乙個系統 3.開啟onekey ghost 選擇你的第二個系統...