矢印付きdiv要素

Question

右上に表示矢印を持つdiv要素を表示しようとしています。 私はCSSとHTMLを使用しています。私はCSSを正しく整理しているようだ。 注：純粋なコードだけの画像は使用しません。

ご協力いただければ幸いです。 おかげ

Answer 1

<style> 
.arrow { 
float: right; 
width: 0; 
height: 0; 
border-color: #fff #fff #000 #fff; 
border-style: solid; 
border-width: 0 15px 20px 15px; 
} 
</style> 

<div class="arrow"> </div> 

Answer 2

あなたがポジションを使用することができます特定の位置のコード例ではdiv要素を移動する相対：

HTML

<div class="wrapper"> 
    <div class="arrow"></div> 
</div> 

CSS

.wrapper { 
    background-color: green; 
    height: 200px; 
    width: 250px; 
} 
.wrapper .arrow { 
    position:relative; 
    right:0; 
    height:40px; 
    width:40px; 
    background:#03F; 
} 

ライブ例：http://jsbin.com/iviha4

Answer 3

たぶん、このリンクはあなたを助けることができる：

http://cssarrowplease.com