1-2 幫Blogger所有的連結圖片導圓角
更新於 發佈於 閱讀時間約 1 分鐘
在上一篇文章1-1 利用免費Blogger版型創建寫作部落格，可以知道我使用的版型是2018年的，那時的圖片還不興導圓角，可是在今年新出的樣版，都將圖片加上圓角，實在有些羨慕，那該怎麼辦呢？
其實是非常容易的，只要按滑鼠右鍵，之後就是剪下、貼上的事。
不過首先，你得知道圓角的CSS語法為border-radius，利用它來決定四個角的圓弧程度，如下。
border-radius: 8px （可自行調整px數）
以使用Google瀏覽器與No End's Writing為例。到自己的首頁，任意滑鼠右鍵點選一張縮圖，出現指令列，點選檢查，就會出現如上圖的畫面。查看元素名稱，直接框選後複製。
接著到Blogger後台／主題／自訂／編輯HTML，進到裡面後：
- 點進html內文，用Ctrl＋F叫出搜尋列；
- 貼上剛剛複製下的元素名稱；
- Eneter後找到CSS位置所在，原本的指令只有max-width:100%；
- 加上；號，再將border-radius: 8px貼於其後；
- 儲存後即可看到所有圖片都成圓角。
之後別忘了進到貼文內，因為裡面的圖片元素是不一樣的，照著上面的方式再操作一遍。
這樣就完成Blogger導圓角的作業，是不是比想像中的還要容易。而且幾乎所有的Blogger修改，都能夠透過這個方式完成。有哪裡不喜歡，就修改掉吧！
是不是對創建自己的Blogger更有信心了呢？趕快試試吧！
留言0
查看全部
你可能也想看
Google News 追蹤
隨著理財資訊的普及，越來越多台灣人不再將資產侷限於台股，而是將視野拓展到國際市場。特別是美國市場，其豐富的理財選擇，讓不少人開始思考將資金配置於海外市場的可能性。
然而，要參與美國市場並不只是盲目跟隨標的這麼簡單，而是需要策略和方式，尤其對新手而言，除了選股以外還會遇到語言、開戶流程、Ap
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
這篇文章分享了 CSS Battle 第 38 題的解法，並提供了相關的技術總結。文章內容包括了使用 flex 排版處理、背景漸層的方法處理等相關技術。透過這篇文章可以學習到如何解決 CSS 切版的問題。
本文介紹了CSS Battle #172 交叉骷髏題目的解答技巧，包括圖層拆解的熟練程度和對小圓拆開處理等技巧。作者分享了100%的解法，鼓勵讀者分享自己的作法與交流。
這篇文章將介紹如何透過CSS Battle的題目來練習基礎切版技巧。透過一個眼睛圖案的例子，提供了對於 border、outline、border-radius等屬性的調整方式，並分享了一種 100% 的解法。歡迎大家分享自己的作法與作者交流，一起學習成長。
這篇文章分享了作者對CSS Battle #151題目的解題方式，並強調了圖形解構的重要性。作者提到了基本的排版能力以及實際應用的弧度計算。透過這篇文章，讀者可以學習到CSS切版的技巧，同時也可以分享自己的作法，進行交流討論。
這是一篇關於CSS Battle系列的文章，介紹瞭如何通過CSS來處理特定圖案的切版與前端工程技術。文章分享了使用grid和radial-gradient()方法來處理特定圖案的解法以及相關技術總結。
本篇文章介紹了 CSS Battle 第 163 題的解法，並分享了作者的實際操作方法。透過使用 gird 排版、before & after 搭配 overflow: hidden 等修飾來創建多邊形。這篇提供了基本的 CSS 切版技術以及解法分享。
前言
終於要到這個振奮人心的章節了，我們終於要來學習，如何讓自己的網頁更加美觀。
但在這之前，我們肯定得先學習，如何將我們的 CSS 檔案，連接到 HTML 當中。
連結分類
首先，我們在連結 CSS 的方法中，有分為三種：
內聯連結
在 .html 當中，任一標籤的裡面，用屬性 s
您對前端有興趣，對CSS不陌生。CSS新特性前應瞭解基本內容。CSS屬性制定經歷過程，瀏覽器私有前綴及處理，開發者對新特性漸進增強，優雅降級處理，Web標準定義、作用等。
隨著理財資訊的普及，越來越多台灣人不再將資產侷限於台股，而是將視野拓展到國際市場。特別是美國市場，其豐富的理財選擇，讓不少人開始思考將資金配置於海外市場的可能性。
然而，要參與美國市場並不只是盲目跟隨標的這麼簡單，而是需要策略和方式，尤其對新手而言，除了選股以外還會遇到語言、開戶流程、Ap
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
這篇文章分享了 CSS Battle 第 38 題的解法，並提供了相關的技術總結。文章內容包括了使用 flex 排版處理、背景漸層的方法處理等相關技術。透過這篇文章可以學習到如何解決 CSS 切版的問題。
本文介紹了CSS Battle #172 交叉骷髏題目的解答技巧，包括圖層拆解的熟練程度和對小圓拆開處理等技巧。作者分享了100%的解法，鼓勵讀者分享自己的作法與交流。
這篇文章將介紹如何透過CSS Battle的題目來練習基礎切版技巧。透過一個眼睛圖案的例子，提供了對於 border、outline、border-radius等屬性的調整方式，並分享了一種 100% 的解法。歡迎大家分享自己的作法與作者交流，一起學習成長。
這篇文章分享了作者對CSS Battle #151題目的解題方式，並強調了圖形解構的重要性。作者提到了基本的排版能力以及實際應用的弧度計算。透過這篇文章，讀者可以學習到CSS切版的技巧，同時也可以分享自己的作法，進行交流討論。
這是一篇關於CSS Battle系列的文章，介紹瞭如何通過CSS來處理特定圖案的切版與前端工程技術。文章分享了使用grid和radial-gradient()方法來處理特定圖案的解法以及相關技術總結。
本篇文章介紹了 CSS Battle 第 163 題的解法，並分享了作者的實際操作方法。透過使用 gird 排版、before & after 搭配 overflow: hidden 等修飾來創建多邊形。這篇提供了基本的 CSS 切版技術以及解法分享。
前言
終於要到這個振奮人心的章節了，我們終於要來學習，如何讓自己的網頁更加美觀。
但在這之前，我們肯定得先學習，如何將我們的 CSS 檔案，連接到 HTML 當中。
連結分類
首先，我們在連結 CSS 的方法中，有分為三種：
內聯連結
在 .html 當中，任一標籤的裡面，用屬性 s
您對前端有興趣，對CSS不陌生。CSS新特性前應瞭解基本內容。CSS屬性制定經歷過程，瀏覽器私有前綴及處理，開發者對新特性漸進增強，優雅降級處理，Web標準定義、作用等。