IT用語辞典バイナリ | さくいん | サイトマップ | ヘルプ | お気に入りに追加  
CSS3リファレンス
IT用語辞典バイナリ<パソコン用語・コンピュータ辞書>
コンピュータ偉人伝<人物・画像・写真・プログラミング>
コンピュータ偉人伝<人物・画像・写真・プログラミング>
コンピュータ偉人伝<人物・画像・写真・プログラミング>
拡張子辞典<ファイル・変換・変更・表示>
HTML5タグリファレンス
CSS3リファレンス
HTML5 JavaScript API
エクセル関数リファレンス
ITパスポート試験
 
  
  IT用語辞典バイナリ > CSS3リファレンス > マーキー > marquee-directionの解説
  カテゴリ別さくいん
  タグ別さくいん

marquee-directionの解説

マーキーの動きの方向を指定するには?

要素書式

  • marquee-direction:【方向】;

対応ブラウザ

  • IE 9:×
  • Firefox 10.0:×
  • Opera 11.6:×
  • Chrome 16.0:○(-webkit-marquee-direction)
  • Safari 5.1:○(-webkit-marquee-direction)

    ※現在、動作にベンダープレフィックスが必要なブラウザは、括弧内にベンダープレフィックス付のプロパティを記載しています。
    ブラウザWindows 7上で動作確認を行っています。
    ユーザーの設定より、異なる挙動をする場合があります。

値一覧

内容
方向マーキーの動きの方向を指定します。
指定できる値は次の通りです。
「forward」:閲覧順に指定します。
「reverse」:閲覧順と逆の方向に指定します。
なお、「marquee-direction」プロパティの初期値は「forward」となります。

解説文

コンテンツが表示領域に入りきらない場合の1つの解決策として、コンテンツスクロールさせて全体を表示する、マーキーという方法があります。

marquee-directionプロパティは、マーキーの最初の動きの方向を指定することができます。
実際ではマーキーの動きは要素の「direction」プロパティと「overflow-style」プロパティの値に影響されます。

  • direction
    テキストの記述の向きを表します。英語や日本語などテキストの閲覧順は左から右(directionのデフォルト値はltr)に対して、アラビア語などテキストの閲覧順は右から左(directionのデフォルト値はrtl)となります。
  • overflow-style
    マーキーの向きが水平(marquee-line)か垂直(marquee-block)かを表します。

現在ChromeSafariは対応していますが、独自のキーワードを使っています。

  • forward
    マーキーの向きが水平(marquee-line)の場合は「forwards」(左から右)で対応します。
    マーキーの向きが垂直(marquee-block)の場合は、「down」(上から下)で対応します。
  • reverse
    マーキーの向きが水平(marquee-line)の場合は「backwards」(右から左)で対応します。
    マーキーの向きが垂直(marquee-block)の場合は、「up」(下から上)で対応します。

サンプルソース1

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル1</title>
<style>
p{
   width:600px;
   overflow: -webkit-marquee;
   overflow: marquee;
   overflow-style: marquee-block;
   -webkit-marquee-direction: down; <!--「down」はChromeとSafari独自のキーワード-->
   marquee-direction: down; <!--「down」はChromeとSafari独自のキーワード-->
}
</style>
</head>
<body>
<p>となりには2匹の猫がいます。1匹は<b>白い耳</b>をもつ黒猫で、もう1匹は<b>黒い尻尾</b>をもつ白猫です。・・・</p>
</body>
</html>

サンプルソース2

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル2</title>
<style>
p{
   width:600px;
   overflow: -webkit-marquee;
   overflow: marquee;
   overflow-style: marquee-line;
   -webkit-marquee-direction: forwards; <!--「forwards」はChromeとSafari独自のキーワード-->
   marquee-direction: forwards; <!--「forwards」はChromeとSafari独自のキーワード-->
}
</style>
</head>
<body>
<p>となりには2匹の猫がいます。1匹は<b>白い耳</b>をもつ黒猫で、もう1匹は<b>黒い尻尾</b>をもつ白猫です。・・・</p>
</body>
</html>

関連項目




Amazon Fire 7Amazon Fire 7
Amazon.comが販売する7インチタブレット。
VAIO Phone AVAIO Phone A
VAIO株式会社が製造するAndroidスマートフォン。
Amazon Echo LookAmazon Echo Look
Amazon.comが販売するカメラ付きAmazon Echo端末。

 ・ITパスポート試験とは
 ・試験範囲と内容
 ・サンプル問題にチャレンジ

 ・Windowsの歴史
ジョン・マッカーシー LISPの開発者
ジョン・マッカーシー
人工知能の研究分野における第一人者。
スティーブ・ジョブズ Appleの共同創設者
スティーブ・ジョブズ
「Mac」や「iPhone」を生み出した経営者。
デニス・リッチー C言語、UNIXの開発者
デニス・リッチー
C言語の設計、UNIXの開発に携わった人物。
».m4b MPEG-4オーディオファイルの拡張子。 up!
».m4r iPhoneの着メロにするAACファイルにつく拡張子。 up!
».xlsx Excel 2007で作成したファイルのデフォルトの拡張子。
».docx Word 2007の標準的な保存形式。XML形式となっている。

2017年5月25日現在
ランキング1   ICT (用語辞典)
ランキング2   セグメント (用語辞典)
ランキング3   スワイプ  (用語辞典)
ランキング4   リーンスタートアップ  (用語辞典)
ランキング5   コンテキスト  (用語辞典)
ランキング6   バリデーション  (用語辞典)
ランキング7   ハードコピー  (用語辞典)
ランキング8   輻輳  (用語辞典)
ランキング9   ウォーターマーク  (用語辞典)
ランキング10   メンション  (用語辞典)
RSS 0.91 RSS 1.0 RSS 2.0
IT用語辞典バイナリについてウェブリオ株式会社についてお問い合わせ先テクニカルライター募集利用規約
プライバシーポリシー著作権・商標について協力社一覧Weblio 辞書スマート翻訳英和辞典 - Weblio辞書Weblio英会話
©2012 Weblio, Inc. All rights reserved.