本站電子書

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

HTML DOM 快速導覽 - 樣式設定的屬性 right

CSS 樣式表 (cascading style sheets) 的 top 性質 (property) 可控制 HTML 元素 (element) 對右端定位方式,亦可由 JavaScript 程式取得元素物件,再用 style 的屬性 (attribute) right 進行設定。



right 可用數字或百分比進行設定。


舉例如下
function run00(demo) {
    demo.style.right = "55%";
}

/* 《程式語言教學誌》的範例程式
    http://pydoing.blogspot.com/
    檔名:style084.js
    功能:示範 JavaScript 程式 
    作者:張凱慶
    時間:西元 2011 年 8 月 */


此例將相關元素設定為 55%
demo.style.right = "55%";


我們以下面的 HTML 文件載入
<html>
<head>
<title>網頁標題</title>
<script src="style084.js" type="text/javascript"></script>
<style>
.a {
    position: absolute;
}
</style>
</head>
<body>
<i class="a" onclick="run00(this);">There is no spoon.</i>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:style084.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


瀏覽器 (browser) 開啟,文字原本在第一行



點擊 There is no spoon. ,文字就會位移



中英文術語對照
CSS 樣式表cascading style sheets
性質property
元素element
屬性attribute
瀏覽器browser


您可以繼續參考
CSS 範例

樣式設定物件 style


相關目錄
HTML DOM 快速導覽
JavaScript 教材
首頁


參考資料
https://developer.mozilla.org/en/DOM/CSS
https://developer.mozilla.org/en/CSS/right

沒有留言: