HTML・CSS 独自のタグを作成することは可能でしょうか？

Question

タイトルの通り、

「 HTML・CSS 独自のタグを作成することは可能でしょうか？ 」

宜しくお願い致します。

Answer 1

「タグ」ではありませんが…。

カスタム要素 (Custom Elements)

HTMLにはカスタム要素があります。

• 4.13 カスタム要素 - HTML Standard 日本語訳
• Custom Elements: HTML に新しい要素を定義する - HTML5 Rocks
• Custom Elements - Can I use...

カスタムプロパティ (Custom Properties)

CSSにはカスタムプロパティがあります。

• 2. カスタムプロパティを定義する： プロパティの族 --* — CSS Custom Properties for Cascading Variables Module Level 1 （日本語訳）
• CSS Variables (Custom Properties) - Can I use...

ベンダープレフィックス (vendor-prefixe)

CSS実装(ブラウザ)はベンダープレフィックスによって、独自のプロパティを定義する事が出来ます。

• 10.7. Experimental implementations - CSS Syntax Module Level 3

Re: shooto さん

Answer 2

HTMLはできません。でもXHTMLならできます。
要素を定義しているDTDを自作するっていう凄いマニアックなことができるようになってます。
でも実際にそれやったことある人あまりいないのではないかな？

参考資料のリンク貼っときますね。
http://www.y-adagio.com/public/standards/tr_xhtml_mod/dtd_developing.html

Answer 3

端的にお答えすると、出来なくはないですが、かなり大変だと思うので、出来ないと答えさせてください。

今時点で、html自体にそのような仕様は存在しないと思います（間違ってたらスイマセン）。

ただ、Web Componentという仕様が進んでいたり、既存のJavaScriptフレームワークを使用すれば可能です。
Web Componentsとは何か？
vuejs コンポーネント

上記のような機能を使用すれば<flower></frower>みたいなタグを自作することは可能です。

しかし、Web componentに関してはまだすべてのブラウザに対応しているわけではないので、（個人的には）使用は控えたほうがよいと思っています。
また、vueJSなどのコンポーネント化に関しては、vueJSやJavaScript自体の学習に時間を要したり、色々な問題が発生しそうなので今のところおすすめはしません。

もし、このタグにこのレイアウトを適用したい！ということでしたら、CSS自体でそのようなものを作成して<div class="flower"></div>などとするほうが現実的ではないかなぁと思います！