本站電子書

您可以在這些電子書店找到本站電子書: Google Play 圖書iBooks StoreHyReadReadmooPubu
===>>>本站推出學習遊戲意見調查<<<===《如何自學程式設計》入選 Google Play 台灣地區2016年度最佳書籍

CSS 2.1 快速導覽 - 右邊界 margin-right

margin-right 性質 (property) 為 CSS 中用來設定區塊元素 (block element) 的右邊界 (margin) ,有以下的關鍵字 (keyword)

  • auto


margin-right 為區塊右邊的邊界,另外還有左邊界 margin-left 、上邊界 margin-top 、下邊界 margin-bottom ,以及邊界的速記性質 margin 。


舉例如下
.example {
    margin-right: 200px;
    border: thin solid black;
}

/* 《程式語言教學誌》的範例程式
    http://pydoing.blogspot.com/
    檔名:block06.css
    功能:示範 CSS 2.1 樣式表的使用 
    作者:張凱慶
    時間:西元 2011 年 7 月 */


我們以下面的 HTML 文件載入
<html>
<head>
<title>網頁標題</title>
<link rel="stylesheet" type="text/css" 
      href="block06.css">
</head>
<body>
<img class="example" src="example.jpg">
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     htt://pydoing.blogspot.com/
     檔名:block06.html
     功能:示範 CSS 2.1 樣式表的使用 
     作者:張凱慶
     時間:西元 2011 年 7 月 -->


瀏覽器 (broswer) 開啟如下



由於此例中沒有設定邊距 (padding) ,因此黑色的邊框 (border) 緊緊包住圖片。


中英文術語對照
性質property
區塊元素block element
邊界margin
關鍵字keyword
瀏覽器broswer
邊距padding
邊框border


您可以繼續參考

JavaScript 範例

區塊相關


相關目錄
CSS 2.1 快速導覽
HTML, CSS 教材
首頁


參考資料
http://www.w3.org/TR/CSS21/box.html
https://developer.mozilla.org/en/CSS/margin-right

沒有留言: