iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 7
1
自我挑戰組

「我還沒上車阿」搭上前端網頁的浪潮了嗎?系列 第 7

「我還沒上車阿」搭上前端網頁的浪潮了嗎?-CSS

  • 分享至 

  • xImage
  •  

上一篇把選取器說完了

今天的話則是稍微介紹一下常用的CSS

只是實際的運用還是要自己去摸索

我們改樣式
最直觀的就是顏色

所以
介紹顏色

並且介紹一下行內和拉出來CSS的寫法

<h1 style="background-color:Blue;">我是個大標題</h1>

上面這行的意思是
h1標籤,文字的背景顏色是藍色,

而也可以這樣寫

在.css檔案中

h1 {
    background-color:Blue;
}

這樣一樣會套用至h1這標籤,如果要再特別指定,就再用昨天所說的選取器去選

顏色的話
除了我們上面用的內建顏色外,還有許多種顏色的表現方式

<h1 style="background-color:rgb(255, 99, 71);">這個是用RGB表示</h1>
<h1 style="background-color:#ff6347;">這個也是RGB</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">這個是用HSL的顏色表示法</h1>

<h1 style="background-color:rgba(255, 99, 71, 0.5);">這個是用RGBA的顏色表示法,比起RGB多了一個透明度的項目,也就是第四個,值是0.5的那個參數</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">這個是用HSLA的顏色表示法,比起HSL多了一個透明度的項目,也就是第四個,值是0.5的那個參數</h1> 

然後帶一下flex



上一篇
「我還沒上車阿」搭上前端網頁的浪潮了嗎? -HTML + CSS
下一篇
「我還沒上車阿」搭上前端網頁的浪潮了嗎?-Flex
系列文
「我還沒上車阿」搭上前端網頁的浪潮了嗎?11
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言