Bootstrapモーダルの背景にアイテムを置く方法は？

私は通常のブートストラップ3モーダルを使用していますが、少し調整したいと思います。Bootstrapモーダルの背景にアイテムを置く方法は？

は、私はこのような左上のロゴや背景の右上の閉じるボタンを配置したい：私はいくつかのCSS擬似セレクターので遊んでてきた

コンテンツを挿入しますが、それは機能しませんでした。多分あなたの人の一人がアイデアを持っています。

ありがとうございます。

出典

2016-05-27 Florian Braun

あなたは投稿できますあなたのコードはどうですか？しかし、たぶん「フロート：左」と「フロート：右」があなたのために仕事をします。 –

これらの要素をHTMLに挿入できませんか？なぜ擬似セレクタ.... http：//www.bootply.com/AQafF1LaVw – DaniP

あなたはモーダルのために、通常のHTMLにそれらの要素を挿入し、クラス名pull-rightとpull-leftを使用することができます。

<div id="myModal" class="modal fade" tabindex="-1" role="dialog"> 
    <img class="pull-left" src="YourLogo.png"> 
    <div class="pull-right">Close-Ico</div> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     ....

この例をチェックしてくださいhttp://www.bootply.com/AQafF1LaVw

出典

2016-05-27 16:18:29 DaniP

ありがとう、これは素晴らしいと私のために簡単に働いた。私はモーダルダイアログdivの外にコンテンツを配置できることに気づいていませんでした。 –

ボディに新しい隠し要素を配置し、背景が表示されているときにのみ表示することができます。 .modal-openは、モーダルが開いているときにbodyタグにのみ適用されます。

.modal-open-inner { 
    display:none; 
} 

.modal-open .modal-open-inner { 
    display:block; 
    position:absolute; 
    top:0; 
    left:0; 
    right:0; 
    bottom:0; 
    width:100%; 
}

http://codeply.com/go/HdMsy0WdWS

出典

2016-05-27 15:37:12 ZimSystem

Bootstrapモーダルの背景にアイテムを置く方法は？

答えて

関連する問題