====== Bulmaで画像の配置 ====== https://bulma.io/documentation/elements/image/ ===== チャット画面などで丸い画像を作る =====

===== Cardの中に画像と文章 ===== Cardの中に画像と文章を横並びに表示したい場合





  
    
      
        
          
        
      
      
        John Smith
        @johnsmith
      
    

    
      Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      Phasellus nec iaculis mauris. 
      

      11:09 PM - 1 Jan 2016

https://bulma.io/documentation/components/card/ {{:00.cssフレームワークbulma用テンプレート:pasted:20190615-132934.png}} https://codesandbox.io/s/divine-sky-z2tnu ===== 角が丸い四角のCSS ===== https://github.com/adash333/ionic4-firebase-chat2/blob/master/src/app/chat/chat.page.scss


.media-body {
  padding: 5px 10px;
  background-color: #98fb98;
  border-radius: 6px;
  font-size: 12px;
  color: #555;
  left: 10%;
  right:10%;
}

これにより、

　の中身が、角が丸い四角になります。 ===== いらすとやの動物アイコン ===== https://www.irasutoya.com/2014/08/blog-post_69.html ===== リンク ===== 目次:[[00.cssフレームワークbulma用テンプレート:index.html|CSSフレームワークBulma利用のためのテンプレートhtmlファイル]]