【保存版】初心者〜中級者向け〈 HTML タグ 〉for Steemit（Japanese Ver.）

in jp-newbie •  7 years ago  (edited)

こんにちは！

HTMLタグを用いたブログレイアウトの HowTo は既に多くの方が投稿されています。
私自身そのような投稿には度々お世話になっておりますが、そのほとんどが英語でしたので日本語の充実したタグ集を作りたいなと思いました。

タグを使うと投稿を書き上げるために必要な時間が少々割り増しになりますが、少しの使用でもとても読みやすくなります。
何か複雑な事柄を説明する投稿には可読性の向上を図るために必須なのではないかとも思っています。

初心者の方はもちろんのこと、投稿に慣れている方にもレイアウトの参考に役立てていただければと思います。

html_steemit.png


① テキスト用


文字の編集

　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　
Steemit の表示HTML タグ
太文字<b>太文字</b>
斜体（イタリック）<em>斜体（イタリック）</em>
太文字の斜体<b><em>斜体（イタリック）</em></b>
削除済み<del>削除済み</del>
等幅テキスト<code>等幅テキスト</code>
リンクを貼る<a href=“リンク先URL”>リンクを貼る</a>



※HTMLコードのサンプルなどを記述する場合の例 　 　　 　　 　 　 　　 　　 　
Steemit の表示HTML タグ
SampleCode
<pre><code>SampleCode</code></pre>


見出しのサイズ

　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　
Steemit の表示HTML タグ

header1

<h1>header1</h1>

header2

<h2>header2</h2>

header3

<h3>header3</h3>

header4

<h4>header4</h4>
header5
<h5>header5</h5>
header6
<h6>header6</h6>


上付き／下付き文字（小さい文字）

　 　　 　　 　 　 　　 　　 　 　 　　 　　 　
Steemit の表示HTML タグ
上付き文字上付き文字上付き文字上付き文字<sup>上付き文字</sup>上付き文字
下付き文字下付き文字下付き文字下付き文字<sub>下付き文字</sub>下付き文字


行の編集

　 　　 　　 　　 　 　 　　 　　 　　 　 　 　　 　　 　　 　 　 　　 　　 　　 　
スタイルSteemit の表示HTML タグ
改行任意の位置で
改行する。		任意の位置で<br>改行する。
中央揃え
---中央に揃える---
--中央に揃える--
<center>中央に揃える</center>
引用符
引用符をつける
<blockquote>引用符をつける</blockquote>


リスト表示

　 　　 　　 　　 　 　 　　 　　 　　 　 　 　　 　　 　　 　
スタイルSteemit の表示HTML タグ
番号なしリスト
  • Steemit
  • UpVote
  • SteemPower
 <ul>
<li>Steemit</li>
<li>UpVote</li>
<li>SteemPower</li>
</ul>
番号付きリスト
  1. Steemit
  2. UpVote
  3. SteemPower
 <ol>
<li>Steemit</li>
<li>UpVote</li>
<li>SteemPower</li>
</ol>


以上、文字の編集に使える HTML タグでした。
<sup> と <sub> は通常、記号などに用いるタグなのだと思いますが
使い方によっては通常テキストの約半分の大きさのテキストとして
使用することができますので便利です。



② レイアウト用


１. テーブル表示


Steemit の表示
　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　
１行目　左（項目名）１行目　右（項目名）
２行目　左（項目1）２行目　右（項目1）
３行目　左（項目2）３行目　右（項目2）
４行目　左（項目3）４行目　右（項目3）

HTML コード
<table>

　<tr>

　　<th>１行目　左（項目名）</th>

　　<th>１行目　右（項目名）</th>

　</tr>

　<tr>

　　<td>２行目　左（項目1）</td>

　　<td>２行目　右（項目1）</td>

　</tr>

　<tr>

　　<td>３行目　左（項目2）</td>

　　<td>３行目　右（項目2）</td>

　</tr>

　<tr>

　　<td>４行目　左（項目3）</td>

　　<td>４行目　右（項目3）</td>

　</tr>

</table>
※ <tr> から </tr> までがテーブルの１行です。必要に応じて行数を増減させてください。
※ <th> から </th> はヘッダーセルです。太字のヘッダーが不要の場合は行を削除します。

２. 右側コラム表示


２− 1. 右側にテキストコラムを表示する
Steemit の表示
□サンプルテキスト右側の文章
□サンプルテキスト左側の文章

HTMLコード
<div class="pull-right">
□サンプルテキスト右側の文章
</div>
□サンプルテキスト左側の文章


２− 2. 右側に画像コラムを表示する
Steemit の表示
□サンプルテキスト左側の文章

HTMLコード
<div class="pull-right">
http://kojiman.info/wp-content/uploads/2018/05/sample.png
</div>
□サンプルテキスト左側の文章


２− 3. 左側に画像、右側にテキストコラムを表示する
Steemit の表示
□サンプルテキスト右側の文章

HTMLコード
<div class="pull-left">
http://kojiman.info/wp-content/uploads/2018/05/sample.png
</div>
□サンプルテキスト右側の文章


以上、HTMLタグとコードのまとめでした！
コードをコピペして使ってみてください。


Markdown 集もありますので、参考にしてくださいね！

【保存版】初心者〜中級者向け〈マークダウン〉for Steemit（Japanese Ver.）



では〜！



jp-newbie japanese html tag code
7 years ago by

Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

  • Disagreement on rewards
  • Fraud or plagiarism
  • Hate speech or trolling
  • Miscategorized content or spam

Submit
$4.74
  • Past Payouts $4.74
  • - Author $3.65
  • - Curators $1.09
29 votes
22
Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  
  • Trending
    • [-]
      ·  7 years ago 

    探してました！こういうの。
    ありがとうございます！！

    Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

    • Disagreement on rewards
    • Fraud or plagiarism
    • Hate speech or trolling
    • Miscategorized content or spam

    Submit
    $0.00
      [-]
        ·  7 years ago (edited)

      リブログをありがとうございます😊
      便利に活用していただけると嬉しいです。

      Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

      • Disagreement on rewards
      • Fraud or plagiarism
      • Hate speech or trolling
      • Miscategorized content or spam

      Submit
      $0.00
        [-]
          ·  7 years ago 

        参考になります！(´∀｀)
        どこまでタグが表示されるのか分からなかったのでこれは便利ですね(        ´-`)

        Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

        • Disagreement on rewards
        • Fraud or plagiarism
        • Hate speech or trolling
        • Miscategorized content or spam

        Submit
        $0.00
          [-]
            ·  7 years ago (edited)

          リブログありがとうございます！

          これで全てではないかもしれませんので見つかり次第追加させていただきますね。

          Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

          • Disagreement on rewards
          • Fraud or plagiarism
          • Hate speech or trolling
          • Miscategorized content or spam

          Submit
          $0.00
            [-]
              ·  7 years ago 

            これは助かります！
            ありがとうございます^^

            Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

            • Disagreement on rewards
            • Fraud or plagiarism
            • Hate speech or trolling
            • Miscategorized content or spam

            Submit
            $0.00
              [-]
                ·  7 years ago 

              ありがとうございます！
              手前味噌になってしまいますが、我ながら重宝しております！

              Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

              • Disagreement on rewards
              • Fraud or plagiarism
              • Hate speech or trolling
              • Miscategorized content or spam

              Submit
              $0.00
                [-]
                  ·  7 years ago (edited)

                マークダウン版も作らせていただこうかと思っております。

                Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                • Disagreement on rewards
                • Fraud or plagiarism
                • Hate speech or trolling
                • Miscategorized content or spam

                Submit
                $0.00
                  [-]
                    ·  7 years ago 

                  @yo-yo さんリブログありがとうございます！

                  Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                  • Disagreement on rewards
                  • Fraud or plagiarism
                  • Hate speech or trolling
                  • Miscategorized content or spam

                  Submit
                  $0.00
                    [-]
                      ·  7 years ago 

                    あ、あとでコメントしようと思って先にシェアしちゃいました。
                    活用させていただきます♡ ありがとうございますw
                    特に小さい文字にする方法はずっと気になってたんで助かりますmm

                    Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                    • Disagreement on rewards
                    • Fraud or plagiarism
                    • Hate speech or trolling
                    • Miscategorized content or spam

                    Submit
                    $0.00
                      [-]
                        ·  7 years ago 

                      そうなんですよ。
                      HTML タグ集を作りたいとは思いつつなかなか手がつかずにいたのですが小さい文字にする方法が見つかったので、よいしょと腰が持ち上がりました w

                      Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                      • Disagreement on rewards
                      • Fraud or plagiarism
                      • Hate speech or trolling
                      • Miscategorized content or spam

                      Submit
                      $0.00
                        [-]
                          ·  7 years ago 

                        （わたし）らっきー💗

                        Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                        • Disagreement on rewards
                        • Fraud or plagiarism
                        • Hate speech or trolling
                        • Miscategorized content or spam

                        Submit
                        $0.00
                          [-]
                            ·  7 years ago 

                          これは保存版ですね！めっちゃ便利です！！！

                          Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                          • Disagreement on rewards
                          • Fraud or plagiarism
                          • Hate speech or trolling
                          • Miscategorized content or spam

                          Submit
                          $0.00
                            [-]
                              ·  7 years ago 

                            リブログありがとうございます！
                            ちょっとした部分にでも、ぜひ活用してあげてくださいー。

                            Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                            • Disagreement on rewards
                            • Fraud or plagiarism
                            • Hate speech or trolling
                            • Miscategorized content or spam

                            Submit
                            $0.00
                              [-]
                                ·  7 years ago 

                              @noteman Nice.......

                              Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                              • Disagreement on rewards
                              • Fraud or plagiarism
                              • Hate speech or trolling
                              • Miscategorized content or spam

                              Submit
                              $0.00
                                [-]
                                  ·  7 years ago 

                                Thank you !
                                I also want to post an English version.

                                Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                • Disagreement on rewards
                                • Fraud or plagiarism
                                • Hate speech or trolling
                                • Miscategorized content or spam

                                Submit
                                $0.00
                                  [-]
                                    ·  7 years ago 

                                  @noteman great post!!!!!

                                  Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                  • Disagreement on rewards
                                  • Fraud or plagiarism
                                  • Hate speech or trolling
                                  • Miscategorized content or spam

                                  Submit
                                  $0.00
                                    [-]
                                      ·  7 years ago 

                                    Thank you !!!!!

                                    Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                    • Disagreement on rewards
                                    • Fraud or plagiarism
                                    • Hate speech or trolling
                                    • Miscategorized content or spam

                                    Submit
                                    $0.00
                                      [-]
                                        ·  7 years ago 

                                      はじめまして！
                                      これは便利！！
                                      ありがとうございます(^^)

                                      Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                      • Disagreement on rewards
                                      • Fraud or plagiarism
                                      • Hate speech or trolling
                                      • Miscategorized content or spam

                                      Submit
                                      $0.00
                                        [-]
                                          ·  7 years ago 

                                        ありがとうございます😊

                                        返信が遅れてすみません〜！

                                        部分的にでも、ぜひ活用してください。

                                        Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                        • Disagreement on rewards
                                        • Fraud or plagiarism
                                        • Hate speech or trolling
                                        • Miscategorized content or spam

                                        Submit
                                        $0.00
                                          [-]
                                            ·  7 years ago 

                                          参考になります。ありがとうございます。

                                          Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                          • Disagreement on rewards
                                          • Fraud or plagiarism
                                          • Hate speech or trolling
                                          • Miscategorized content or spam

                                          Submit
                                          $0.00
                                            [-]
                                              ·  7 years ago 

                                            ありがとうございます😊

                                            投稿から２日もたってしまっていたのですね。
                                            返信がなかなかできずすみません。

                                            マークダウンには見た目だけにとどまらない実質的なメリットもありますのでいずれまたご紹介させていただきます。

                                            Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                            • Disagreement on rewards
                                            • Fraud or plagiarism
                                            • Hate speech or trolling
                                            • Miscategorized content or spam

                                            Submit
                                            $0.00
                                              [-]
                                                ·  7 years ago 

                                              Thanks for sharing! A link to your post was included in the Steem.center wiki article 投稿の書式設定のヒント. Thanks, ありがとう and good luck again!

                                              Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                                              • Disagreement on rewards
                                              • Fraud or plagiarism
                                              • Hate speech or trolling
                                              • Miscategorized content or spam

                                              Submit
                                              $0.00