iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 7
0
Modern Web

前端入門學徒-30天學習心路系列 第 7

【Day7】文字效果/ 內外距/邊框樣式/圖片調整

1.font- 文字
font-size: px 字的大小
font-weight: bold 字加粗(bold粗體)

2.外距margin &內距padding : 距離的調整
外距: 區塊與區塊的距離

內外框分四個方向
-top -bottom -left -right
Ex: margin-top   padding-right …
  1. CSS中,邊框樣式
    border-style: solid; (邊框樣式) solid→實線 dashed→虛線
    border-width: 2px; (邊框寬度)
    border-color: #FF0000; (邊框顏色)
4. 查圖片寬度
Ex: 683600 → CSS中 width: 683px 即可包裹著圖片,而不會留一大堆空白
5.加入其他圖片,並且要在img裡面下選擇器 class才能在CSS修改
<img src="image/index-banner2.jpg">
→ <img src="image/index-banner2.jpg" class=" banner2-img">
所以CSS中就是 .banner2-img
6. 調整圖片大小
.banner2-img{
    width: 1000PX;
}

度德而處之,量力而行之-《左傳》


上一篇
【Day6】絕對vs相對單位/文字上色
下一篇
【Day8】區塊vs行內元素/選單設計
系列文
前端入門學徒-30天學習心路10
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言