星期四, 5月 04, 2023

find 找出檔案、grep 找出檔案內容

◆ 過濾結果集：找出符合 grep 條件的目標。三種語法善惡比較
　　Ｘ find /data/trash/ -type f -iname "*test*" | grep -i -Hn "flatpak" {} \;
　　　說明：失敗！ 找出檔案內容的語法「 | 」之後禁止直接 grep，要插入一個轉送器(xargs)

　　△ find /data/trash/ -type f -iname "*test*" | xargs grep -i -Hn "flatpak" {} \;
　　　說明：成功，但額外出現二列指令無效的提示！xargs 之後接 grep 指令似乎水土不合！！
　　　※ 放棄此用法！！轉用「-exec grep 」語法

　　V find /data/trash/ -type f -iname "*test*" -exec grep -i -Hn "flatpak" {} \;
　　　說明：成功！但結果內容多了「檔名」標示 =>　/data/trash/trash20.txt:1:/etc/X11/Xsession.d/20flatpak


◆ 過濾結果集：找出符合 grep 條件的目標 (若目標是檔案，則與找檔案內容無關)
　　語法：<前段語法> | grep -i <關鍵字>
　　說明：grep 針對前段語法所找出的結果集，「再一次」的做篩選

　　範例1：sudo apt list --installed | grep -i "fire*"
　　釋義1：grep 關鍵字的 *星號要放對位置，若打成 "*fire*" 就找不到資料

　　範例2：find /data/trash/ -type f -iname "*t*" | grep -i "45"
　　釋義2：find 目標路徑中「含有t」的檔案。grep 再次篩選出這些檔案中具有「 45 」關鍵字者


◆ 過濾結果集：找出符合 grep 條件的目標 (若目標是檔案，則是在找檔案內容)
　　語法 ：<前段語法> -exec grep -i <關鍵字> {} \;

　　範例1 ：find /data/trash/ -type f -iname "*t1*" -exec grep -i -Hn "flatpak" {} \;
　　範例1 說明 ：二個範例皆有 Hn參數，結果必然會顯示為三區「檔名路徑區、同檔數字區、內容符合(條件)區」
　　結果 => /data/trash/trash20.txt:3:/etc/X11/Xsession.d/20flatpak
　　檔名路徑區(H) ：/data/trash/trash20.txt
　　同檔數字區(n) ：3 (同一檔中，符合 grep 條件的，「至少有3列」
　　內容符合區(i) ：/etc/X11/Xsession.d/20flatpak

　　範例2 ：find /data/trash/ -type f -iname "*t1*" -exec grep -i -Hn "flatpak" {} \; > /data/temp/result.txt
　　範例2 說明 ：此範例尾端多了「轉存」的語法，把結果存入指定路徑檔 result.txt 之中


◆ 過濾結果集：「刪除」符合 grep 條件的檔案與資料夾
　　語法 ：<前段語法> -exec grep -i <關鍵字> {} \;
　　範例 ：先變更身份為「root」=> sudo su -
　　　　　find /data/trash/ -type f -iname "*t1*" -exec grep -i "flatpak" {} \; | xargs rm -fr
　　說明 ：grep 須有參數i，絕不可加參數 Hn，結果必須只是「要刪除檔案的路徑名」


時間
標籤：

星期二, 5月 02, 2023

採用iBus 架構的 Ubuntu 20.04 可刪除的軟體

文字使用圖片取代，點按可放大：
時間
標籤：

採用fcitx 架構的 Linux Mint 21.1 可刪除的資料


○ 刪除不用的人類語言：　Settings > Languages > Language Support

○ 刪除 iBus　　　　：　sudo apt autoremove ibus*

○ 刪除沒用的輸入法　： chewing, pinyin, changjei（預設只安裝嘸蝦米）

○ 刪除沒用的軟體
△　 ・libreoffice-*　　　　(office。實體機可用，VM預設用不著，可刪)
△　 ・thunderbird　　　　　(郵件收發器。實體機可用，VM預設用不著，可刪
　　・celluloid　　　　　　(影片播放器，刪！轉用VLC或SMplayer)
　　・drawing　　　　　　　 (簡易繪畫工具，刪！換成 kolourpaint
　　・evolution　　　　　　(前台：工作日曆。可刪)
！！・evolution-data-server*　(後台：是伺服器，被GNOME使用，刪除就當機）
　　・gnome-color-manager　　　(搞不清它的用途)
　　・hexchat　　　　　　　(線上聊天器，沒用過，刪！)
　　・hypnotix　　　　　　(電視播放器，刪！)
　　・keditbookmarks　　 (書籤編輯器。問題很大常當機，不當機時，要清除書籤也要等到天長地久。必刪！)
　　・pix　　　　　　　　　(圖片瀏覽器，刪！換成 eog (Image viewer)
　　・mintwelcome　　　　(歡迎畫面。刪！)
　　・mugshot　　　　　　　(自我介紹。刪！)
　　・redshift　　　　　　(顏色溫度調整器，沒反應)
　　・rhythmbox　　　　　(音樂播放器。用瀏覽器聽就夠了，刪！)
　　・sticky　　　　　　　(黃色貼紙，刪！)
　　・thingy　　　　　　　(電子書閱讀器，沒用過，刪！)
　　・warpinator　　　　 (線上收送檔案，沒用過，刪！)
　　・xfce4-appfinder　 (尋找已安裝的程式。程式清單中已具有同樣功能，刪！)
　　・xfce4-dict　　　　 (字典編輯器，刪！)
　　・xfce4-taskmanager (Task Manager；換成 Gnome-system-monitor較好用)
　　・xterm　　　　　　　 (終端模擬器，可與遠程溝通。目前Terminal 功能已夠強了)


時間
標籤：

星期日, 4月 30, 2023

Linux Mint 21.1 fcitx架構之嘸蝦米輸入法安裝方式

1、先安裝fcitx
　　・sudo apt install fcitx
　　・安裝完畢，直接登出後再登入（若登入後的作業不順利，應直接重新開機）


2、安裝並啟動嘸蝦米輸入法
　　・sudo apt install fcitx-table-boshiamy
　　・fcitx -r
　　・在作業系統的 Tray Board(系統快捷列)上有一個鍵盤圖形，滑向它並點右鍵，再點選項 Configure
　　・跳出的視窗中能看到「Boshiamy」就沒事。直接跳到「共同流程」


3、啟動失敗之除錯
　　・看不到「Boshiamy」時，就點按下方「 ＋ 」符號
　　・對跳出畫面的下方，把已勾選的「Only Show Current Language」拿掉
　　・在下方輸入欄打入「boshiamy」搜尋，然後畫面會出現 Boshiamy (沒出現代表你的人品不合格 ^_^)
　　・點選畫面中 Boshiamy，然後按 OK按鈕（同時會自動結束視窗）


4、共同流程
　　・在作業系統的 Tray Board(系統快捷列)上有一個鍵盤圖形，滑向它並點右鍵，再點選項 Restart
　　・然後你就看到同一處出現的「中文輸入法」畫面
　　・打開 Text Editor (記事本)，驗證是否能打出中文字？ 按 Ctrl + Space 切換為嘸蝦米 (多種輸入法時依傳統方法切換)
　　・結果必然成功！！若不成功，建議你再上網找找其它人的說明！


5、剩餘設定
　　・剩下的還有一些個人使用習慣的調整設定，同樣去按「 Configure 」
　　・在跳出的畫面中選擇「 Boshiamy 」項目，點按下方右邊第二個的「工具按鈕」（設定不同按鈕風格會
　　　　出現不同的圖示：Applications > Settings Manager > Appearance），一般正常IQ的人應都
　　　　能設定成功


6、輸入法字辭變更
　　・應用工具先安裝：sudo apt install fcitx-tools
　　　　　　　　　　　　- mb2txt　　：解譯成 txt 檔
　　　　　　　　　　　　- txt2mb　　：編譯成 mb 檔
　　・字的變更
　　　　1、mb檔案位置：/usr/share/fcitx/table/
　　　　2、把mb檔解開成txt檔
　　　　　　$ mb2txt /usr/share/fcitx/table/boshiamy.mb > /home/帳戶名/Documents/boshiamy.txt
　　　　3、修改txt檔內容，完畢之後先刪除舊mb檔，後再把 boshiamy.txt 編譯成新的 boshiamy.mb 檔
　　　　　　$ txt2mb /home/帳戶名/Documents/boshiamy.txt > /usr/share/fcitx/table/boshiamy.mb

　　・辭的變更
　　　　1、辭是使用者自加，輸出時要先打「;」字首之後再加字碼。

　　　　2、為了能更寬容放入自編的辭彙，要修改嘸蝦米（boshiamy.txt）的可輸入字碼數，以及可輸入字元類別。然後再去編譯！
　　　　　　a.官方字元類別： ;,.'abcdefghijklmnopqrstuvwxyz[]
　　　　　　b.我自訂的類別： ;,.'abcdefghijklmnopqrstuvwxyz[]\

　　　　3、即時變更辭彙的內容
　　　　　　a.依下列方式作業：
　　　　　　　Tray Board (系統快捷列) > 鍵盤圖示 > Configure > Addon(頁籤)
　　　　　　　> QuickPhrase(快速輸入)清單選項 > Configure按鈕 > Quick Phrase List(快速輸入清單)按鈕
　　　　　　　=> 點按後跳出 Quick Phrase Editor (快速辭彙編輯器), 在此工具自己測一下就了知做法
　　　　　　b.外加辭彙檔案路徑：/usr/share/fcitx/data/quickphrase.d/
　　　　　　　說明：在此目錄下放入任何.mb檔，或經過上述「a項」作業並輸入資料之後，「重新讀取md檔」就能正常出字


7、fcitx 架構選項 跑掉/遺失 之除錯
　　・Setting > Input Method > 在上方選項物件中選 fcitx


8、一些操作方式
　　・mb內容變更，即時重新讀取　：Ctrl + 5，或 Tray Board (系統快捷列) > 鍵盤圖示 > Restart
　　・變更候選字列的外觀　　　　 ：Tray Board (系統快捷列) > 鍵盤圖示 > Configure > Appearance(外觀頁籤)


※ 採用fcitx 架構的 Linux Mint 21.1 可刪除的資料


時間
標籤：

星期二, 4月 25, 2023

OS Development Tutorials

來源：OS Developer

===================================================

Getting Started

Bootsectors

Kernels

Protected Mode

Interrupts & IRQs

Memory Management

Intermediate OS Development

Miscellaneous

General Programming

時間
標籤： ,

OS Development Papers

來源：OS Developer

==================================================

DMA

Hard Disks

Floppy Disks

Mouse/Keyboard

Video

PowerPC

x86-64

x86

General CPUs

General Hardware

Misc/Other

USB/Firewire

Filesystems

時間
標籤： ,

星期五, 2月 10, 2023

Dcard留言傷人遭法院判罰：法律限制了表達意見的自由？

出處：沃草烙哲學 09 Feb, 2023

前年（2021）年底，幾位大學生在Dcard以匿名留言罵人，被一狀告上法院。判決在去年（2022）年底出爐，其中一位承審法官在其判決書中表示：

言論自由乃「表達的自由」，而非「所表達內容的自由」……。言論自由係以尊重為起點，亦以尊重為依歸，因此言論自由概念下之言論內容，如已逸脫一般社會通念下對人應有之尊重……即應加以規制。

由這段文字可知，承審法官似乎認為言論自由並不是保障任何內容的言論都可以被表達的自由，至少當言論內容有「逸脫一般社會通念下對人應有之尊重」的情況時，是可以用法律加以規制的，而誹謗罪及公然侮辱罪等，就是對此類言論的規制。

要管言論，若不管內容，還能管什麼？

可是當自由主義者辯護言論自由時，卻又經常以「保障言論內容之自由」作為論述主軸。例如彌爾（John Stuart Mill）在《論自由》（On Liberty）中為言論自由辯護時，就主張任何意見無論是否符合主流觀點，都應該有被表達的充分自由：「即使全世界除了一個人以外都接受某個主張，就只有那一人持相反意見，當全世界的人要聯合起來去噤聲那一個人時，他們錯誤程度就和那一個人要噤聲全世界一樣嚴重。」（1859/2001, p.18）

因此針對言論自由，彌爾僅僅提出傷害原則（Harm Principle）這一限制：「只有當一個言論在某種特殊情境下被表達出來將會構成傷害他人的惡行時，才能限制言論在那種情境下被表達出來的自由。」（p.52）

即使是支持某些言論管制政策的學者，也會特別強調這些管制不得針對言論的內容為之。例如沃準（Jeremy Waldron）支持以法律管制仇恨言論時就特別指出：「當一個人的言論表達方式會對他人造成傷害，而且有其它不會造成傷害的表達方式能傳達相同的 [意見] 時，才可以正當地禁止前一種言論表達。」（2012, p.183）

為什麼自由主義者會特別強調任何內容的言論都應有被表達的充分自由？這是因為如此才能保障每一個人的自主性和人格完整性。德沃金（Ronald Dworkin, 1992）就曾對此想法提出一個更為清楚的說明：

一個能為自己負責的人，必須能夠自己去決定生活和政治上的價值觀，以及在正義和信仰問題上的是非對錯。因此當政府規定人們不能接觸某些有害的言論時，就是不信任人們可以在這些事務上自己做出恰當的決定……。只有當任何他人都沒有權利替我決定什麼意見是我該或不該接觸時，我才能保有個人的尊嚴。（節2）

然而，如果政府不能因為言論的內容來限制某些言論的表達，但卻又要在特定的言論表達對人造成傷害的時候，去限制該言論的表達，那麼政府還能以什麼作為限制言論的標準？當言論造成傷害時，若不是因為它的內容而對他人造成傷害，還能是因為什麼？難道言論除了內容外還有其它的元素？

言論不只有內容

常識上來說，言論的功能就是用來表達意見和想法，因此言論的核心元素就是它所表達的內容。我們甚至可以這麼說：言論就是由表達時所用到的那些符號（例如寫作時用到的文字，以及說話時用到的聲音等）加上那些符號所表達的內容而已。

如果言論真的就只是符號加上內容的組合，那麼要是言論能夠傷人，就只能是它的內容傷人了，畢竟沒有內容的符號其實就只是一些形狀或聲音而已。但言論的內容要如何傷人呢？言論的內容就只是一些抽象的觀念或想法而已，它無法像揮出的拳頭一樣實際在人的身上造成傷害。就算有些言論真的表達了一些負面的內容（比如對人的批評等），只要接收言論的那一方拒絕接受那些內容（不予認同或嗤之以鼻）不就可以讓言論不會對自己產生任何影響了嗎？而這也是為什麼會有一句俗語說：「言論不會傷人。」（Words don't hurt.）。

但奧斯汀（J. L. Austin）並不同意這個看法，他藉由觀察人們在各種不同的情境下使用語言的方式，發現言論除了能夠表達特定的意見及想法（也就是表達內容）之外，其實還有很多重要面向被人們給忽略了。奧斯汀指出，當人們說話時並不只是透過言論去傳遞想法而已，同時也是在透過言論去完成一些行為，並試圖藉由說話來達成一些效果。奧斯汀將人們透過言論去完成行為並達成效果的這一面向稱為語言的行為或行動（performative）面向。

比如說，我們常在影視作品中看到西方人在教堂舉行結婚典禮時，都是在神父的主持之下完成的，而在典禮中一個關鍵的環結就是結婚的雙方必須在神父問到那個最重要的問題時說出：「我願意。」當新人們在結婚典禮中因應神父所問的問題而說出「我願意」時，他們並不只是在表達自己的意願，他們同時也是藉由說出「我願意」來執行結婚這個行為，新人們藉由說出「我願意」來「成為彼此的配偶」。

又例如，當我一個人走進餐廳坐下後向老闆說出：「我要吃十個餃子和一碗酸辣湯。」我也不只是在表達我想吃的東西給老闆知道而已，我事實上是藉由說出上面這串話來完成「向老闆點餐」的行為。

這些觀察與一般人對語言的理解確實有明顯的出入，比如我們會說「坐而言不如起而行」，在英文裡也有 "Actions speak louder than words." 的說法。這些說法都顯示了在一般人的觀念中，言論和實際的行動有別：言論只能用來表達觀念，單純的說話最多只能影響別人的想法，只有當我們在現實中採取了實際行動後，才有可能對世界產生真正的影響。

但奧斯汀的觀察卻顛覆了這樣的認知，事實上在人類社會中有非常多的行為是透過說話來完成的，這些話語本身就能影響現實。當一個人在婚禮上說出「我願意」時，他同時也改變了自己和另一個人在法律上的關係；當一個人向老闆完成點餐後，他就和老闆建立了一個口頭契約。這些都是透過說話能夠達成的「實際效果」。

當然，要用說話來完成一個行為或達成一個效果並不是真的只要說話就好。從前面的例子可知，要讓說話能夠完成特定的行為就必須在適當的情境和脈絡中說出適當的話才能辦到。如果不是在婚禮的儀式上回覆神父的問題時說出「我願意」，那就無法完成「和某人結婚」的行動；若不是在餐廳裡向老闆或服務員說出自己想要吃的餐點，也無法成功完成「點餐」的行為。

這些在適當的情境下能透過說話來完成的行動就被奧斯汀稱為「言說行為」（speech acts）。不同的言說行為需要的情境脈絡自然也不同，有些言說行為甚至會有相當明確的具體規範（像是婚禮），但這並不妨礙我們去辨識出那些沒有明確規範的言說行為（例如點餐），因為那都是我們生活的一部分。

限制言說行為不見得限制言說內容

一旦對言說行為有了基本的理解以後，我們其實就可以用這個概念來說明言論可以如何造成傷害，以及在不以言論的內容為標準的條件下要如何分辨一個言論是否有害。


考慮以下情境：

小傲和小竹兩人是朋友，小傲在地下錢莊工作，而小竹則正好向那間地下錢莊借了鉅款卻還不出來。地下錢莊的老闆於是要小傲負責向小竹討債，不擇手段。

  • A. 小傲信心十足地要完成這份工作，所以打電話給小竹，並在電話中語氣兇狠地向小竹說：「你要是三天內還不出錢，你一定會死得很難看！」

  • B. 小傲十分擔心小竹的安危，所以偷偷打電話給小竹，並在電話中語氣緊張地向小竹說：「你要是三天內還不出錢，你一定會死得很難看！」
在上述A、B兩種情境中，小傲向小竹說的話，內容上來說是一模一樣的，可是從情境的描述以及小傲的意圖和語氣差異可以看出，在A情況下小傲說出的這句話是在進行「恐嚇」的行為，但在B情況下，小傲說出同樣內容的一句話卻是在「提醒」小竹即將到來的危險。前者明顯觸犯了我國的《刑法》中的恐嚇罪，而後者卻不會有法律上的問題。

除了恐嚇罪以外，《刑法》上的詐欺罪其實也是同樣的道理。對很多詐欺犯罪來說，犯罪者所做的不過就是說說話而已。然而相同內容的話，如果是在確有其事的情況下告訴消費者轉帳過程出了什麼問題需要處理，那就是在對客戶提供服務；但以相同內容的言論企圖誘騙消費者轉帳，就是詐欺行為。

當政府處罰這些犯罪行為時，我們很清楚地知道這是針對行為的處罰，而不是針對言論內容的處罰，也不會擔心這些處罰會對言論自由造成威脅或形成寒蟬效應。把相同的觀念運用在文章開頭提到的案例，我們將不難發現這個判決其實也並非針對被告的言論內容本身進行處罰，而是從被告的說話方式、用詞以及脈絡，觀察出被告確實透過言論進行了羞辱的行為。

如果被告真如他自己所宣稱地是在看到告訴人的照片後表達「自己的主觀感想」，則他根本不需要用到如「幹」（辱罵）、「笑死」（嘲諷）、「我實在硬不起來」（性羞辱）等語，由於這些用語（如法官所言）「逸脫一般社會通念下對人應有之尊重」，顯見被告的言說行為並非單純的「表達感想」或「主觀評論」，而是在「羞辱」和「嘲諷」告訴人。

針對這樣的言說行為予以處罰，並不是限制某些意見的表達自由，我們還是有評論他人美醜或表達自己主觀感受的自由，只是這樣的自由並不保障你可以用會傷害他人人格尊嚴的方式來行使。若你因為羞辱人而受罰，在抱怨自己的言論自由受損之餘，或許也可以考慮一下好好學習待人接物的方法。

時間
標籤：

星期三, 11月 23, 2022

台灣被中共自閉長城封鎖、通過的網站

◆ 偵測工具
　・www.comparitech.com
　・www.chinafirewalltest.com
　・viewdns.info
　・www.websitepulse.com


◆ 商人無祖國，台灣非常被爭議的企業
　　・媒體報導
　　・旺旺集團（維基百科）
　　・旺旺中時媒體集團 (現任董事長蔡衍明、副董事長周錫瑋、總裁蔡紹中)（維基百科）


◆ 被通過之網站
　● 2024-07-26
　　・中時新聞網 (www.chinatimes.com)（旺旺集團控制）
　　・中視新聞網 (www.ctv.com.tw)（旺旺集團控制）
　　・中天新聞網 (www.ctnews.tw)（旺旺集團控制）
　　・中天電視 (www.ctitv.com.tw)（旺旺集團控制）
　　・線上看新聞 (tv2.wfuapp.com) (2022/11被禁現在卻放行，難道老板或高層被阿共仔滲透了嗎？)
　　・ETtoday新聞雲 (www.ettoday.net)（東森新媒體控股(股)控制；嘿〜八封網站阿共仔也愛看，還是王令麟已經xxx？）


◆ 被封鎖之網站
　● 2024-07-26
　　・聯合新聞網 (www.udn.com)
　　・自由時報電子報 (www.ltn.com.tw)
　　・Yahoo奇摩新聞 (tw.yahoo.com)
　　・中央社CNA (www.cna.com.tw)
　　・TVBS新聞網 (news.tvbs.com.tw)
　　・民視新聞網 (www.ftvnews.com.tw)
　　・三立新聞網 (www.setn.com)
　　・台視新聞網 (news.ttv.com.tw)
　　・華視新聞網 (news.cts.com.tw)
　　・公視新聞網 (news.pts.org.tw)
　　・年代電視及年代新聞網 (http://www.eracom.com.tw/)
　　・蘋果新聞網 (www.appledaily.com.tw)
　　・東森電視 (www.ebc.net.tw)
　　・東森新聞 (news.ebc.net.tw)
　　・台灣英文新聞 (www.taiwannews.com.tw) (Taiwan News)
　　・蕃新聞 (n.yam.com)（舊名：蕃薯新聞網）
　　・NOWnews今日新聞 (www.nownews.com)
　　・Google台灣新聞網 (news.google.com.tw)
　　・鏡新聞 (www.mnews.tw)
　　・工商時報 (ctee.com.tw)


時間
標籤：

星期六, 9月 17, 2022

從 Javascript 修改 CSS

 <!DOCTYPE html>
<html><head></head>
<body>
<p id="foo">hello world</p>
<script>
    var foo = document.getElementById('foo');
    foo.style.color = 'blue';
    foo.style.fontWeight="bold";
    foo.style.fontSize="20px";
 
    // 函數-橫槓式
//    foo.style.setProperty("background-color","lightblue");
 
    // 函數-簡寫式
//    foo.style.setProperty("background","lightblue");
 
    // 函數-駝峰式（失敗，無此方式）
//    foo.style.setProperty("backgroundColor","lightblue");
 
    // 陣列-橫槓式
//    foo.style['background-color'] = '#ddd';
 
    // 陣列-駝峰式
//    foo.style['backgroundColor'] = 'lightyellow';
 
    // 陣列-簡寫式
//    foo.style['background'] = 'blue';
 
    // 橫槓式 (失敗，無此方式)
//    foo.style.background-color = "#eeb";
 
    //駝峰式
//    foo.style.backgroundColor = 'yellow';
 
    //簡寫式
//    foo.style.background = 'rgb(200,150,100)';
</script>
</body>
</html>

時間
標籤： ,

星期五, 9月 16, 2022

CSS background ３個應用範例

CSS 參考來源：點閱
CSS3 參考來源：點閱

現在大部份人使用 background 都是一個一個設定它的其它屬性，但若不涉及CSS3新增的屬性時，它其實可一次設定完畢！

-----------------------------------------------------
１、不同 Background 的宣告方式
-----------------------------------------------------
<!DOCTYPE html>
<html><head></head>
<body>
<style>
    div{
        border:1px solid red;
        width:200px;
        height:200px;
    }
    .test1{
        /* 原始大小 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
    }
    .test2{
        /* 新舊語法混合用，圖像最大化且不失真 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
        background-size:contain;
    }
    .test3{
        /* 新舊語法混合用，圖像最大化，要固定在div背面時，「卻穿透粘在body背景」 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat fixed;
        background-size:contain;
    }
    .test4{
        /* 新舊語法混合用，圖像最大化且失真 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
        background-size:cover;
    }
    .test5{
        /* 只用新語法，圖像最大化且不失真 */
        background-image:url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me');
        background-repeat:no-repeat;
        background-size:contain;
        background-attachment:;
    }
</style>
第一個（原始大小）<br/>
<div class="test1"></div>
<p><br/>
第二個（一個 background 把各屬性全宣告完畢，結果正常）<br/>
<div class="test2"></div>
<p><br/>
第三個（要固定在div背面時，「卻穿透粘在body背景」）<br/>
<div class="test3"></div>
<p><br/>
第四個（background-size:cover 使底端不能正常顯示）<br/>
<div class="test4"></div>
<p><br/>
第五個（使用多個屬性才宣告完畢，結果也是正常）<br/>
<div class="test5"></div>
</body>
</html>


----------------------------------------------------------
２、background 上傳圖片及設定之運用
----------------------------------------------------------
<!DOCTYPE html>
<html><head></head>
<body>
<style>
    div{
        border:1px solid red;
        width:200px;
        height:200px;
    }
    .test1{
        /* 使用原始大小 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
    }
    .test2{
        /* 新舊語法混合用，圖像最大化且不失真 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
        background-size:contain;
    }
    .test3{
        /* 新舊語法混合用，Div 背景圖像最大化，固定在背景時『卻穿透粘在body背景上』*/
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat fixed;
        background-size:contain;
    }
    .test4{
        /* 新舊語法混合用，圖像最大化且失真 */
        background: #fff url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me') no-repeat;
        background-size:cover;
    }
    .test5{
        /* 只用新語法，圖像最大化且不失真 */
        background-image:url('https://drive.google.com/uc?export=view&id=1bEx-mum880QycaawzUN7I26weTMNS-Me');
        background-repeat:no-repeat;
        background-size:contain;
        background-attachment:;
    }
</style>
<div class="test1"></div>
<p>
<div class="test2"></div>
<p>
<div class="test3"></div>
<p>
<div class="test4"></div>
<p>
<div class="test5"></div>
</body>
</html>


-----------------------------------------------------
３、background 之二圖片合併應用
-----------------------------------------------------
<!DOCTYPE html>
<html><head></head>
<body>
<style>
#example1 {
    margin-top:0px;
    background: url(https://drive.google.com/uc?export=view&id=1-J20rOq4FT45R9Fqe1PJmahdBwnX5zZ0) right bottom no-repeat, url(https://drive.google.com/uc?export=view&id=1W-VLYg2ZvLcyvcrw2bOMWKYDd7Lc12Lg) left top repeat;
    padding: 15px;
}
 
</style>
<div id="example1">
<h1>不是痛苦，只是不痛快</h1>
<p>一些官員只求自己職位，疏忽了人民需求，不是停用就是搞網軍。若一個國家會衰敗，這些蠹蟲是禍首！</p>
<p>我自反省，由於已看透這些爪耙子的底細，因他們而導致國民之損失，我並不感覺痛苦，只是心中不痛快而已～</p>
</div>
 
</body>
</html>

時間
標籤： ,
訂閱： 文章 (Atom)