カテゴリーアーカイブ
検索
最新記事

無料で広告無し!ブログはファンブログ

宜しければ応援ポチお願い致します!

貴方の清き1票を私にお願い致しますm(_ _)m

アンケートに御協力をお願い致します
m(_ _)m

CM

紹介コード:xeGWgtCo

お勧めポイントサイト

i2iポイントサイトへのご招待です♪ i2iポイントサイトへのご招待です♪

CHIC-Smart (チックスマート) CM

広告

posted by fanblog

2017年03月03日

最近【details】要素を知った話

目次

備忘録作成中に

私は新しくプログラミングコードを覚えようとすると、以前覚えていた簡単なHTMLを忘れてしまう事が良くあります!それをカバーする為にiPhoneのノートアプリにHTMLの備忘録を作成していました。いつでも思い出せる様に自分の分かりやすいメモ帳を作りたかったというところですが、なかなか希望通りの仕様にはなりません;^_^Aとりあえずでメモ帳アプリにHTMLタグを書き出して、得意のGoogle検索でHTMLの基本的な部分を復習しながら色々読んでいいました。あるリファレンスで、 HTML5の新規タグで、新たに追加されたタグ【details】 というタグが紹介されていました。今まで気が付かなかったのが不思議ですが、以前はCSSやJavascriptを併用して必死に作成していました。しかし、この【details】を使うと簡単に開閉式のタブができます。 と、これだけで開閉式の項目が作成できます。

上記基本コードの表示

開閉式の見出し
  • 項目1
  • 項目2
  • 項目3
これだけで開閉式にできました。試しに上部の目次も作成してみましたが、HTMLに少しのCSSで目次ができました。これならブログ記事にHTMLだけでアコーディオン風に色々表示できると思います*\(^o^)/*

進化するHTML

この【details】要素がアメブロでも使えるか試しましたが、みごとに開閉式になって表示してくれました。HTML5のタグはほぼ知っているつもりでいましたが、油断していると遅れてしまいそうな気がします。HTMLだけではありませんが、プログラミング言語の改定について行けて無い事を気付かされました。私のように毎日iPhoneで勉強していてもこの様な感じですから、仕事をしながらスキルアップしている方々には頭が下がりますね;^_^A色々な仕組みをマスターしたい私にとって、『iPhoneだけで...』の意思が揺らぎます。これからも、どんどん簡単になりどんどん進化するんだろうと痛感します。

iPhoneだけでHP作成

以前から、宣伝している iPhoneだけでHP作成 にしても、全体を無料テンプレートで作成して、部分的に開閉式にしたいところをCSSアコーディオンで表示させています。この表示をさせる為に数日かけて表現した気がします;^_^A苦労した割に閲覧してくださる方々が少ないので、凹みがちのテンションですが、無料のサーバーなので気長にカスタマイズしてみたいと思います。また、 エックスサーバー の無料プランも試しているので、そこにこのタグを使った備忘録ページを作成すれば、スッキリと備忘録を作成できそうです。独自ドメインや有料サーバーも検討中ですが、療養中の身には小額でもイタイので我慢して無料で攻めています。

スキルアップの薦め

私の場合は、働けなくなってから本格的に勉強し始めましたが、もっと早くスキルアップしておけば良かったと後悔しています。もしも、私がiPhoneを持っていなかったら......多分完全にノイローゼになっていると思います。iPhoneのおかげで、少ないながら収入を得る事ができ、iPhoneのおかげで落ち着いて冷静にスキルアップできています。今日も、「iPhoneだけしか無くても生活費の足しになるような情報」を探しながら、療養生活を楽しんでいます。健康な頃は浪費家でしたが、職を失った事でなるべく節約するようにもなってきました。健常者の方々でも、私のようにスキルアップと節約ができると思います。貴方もスキルアップしてみませんか?

リンクリストサンプル

iPhoneでポイント貯める一覧表
最後まで読んで頂き、ありがとう御座いましたm(_ _)m
この記事へのコメント
コメントを書く

お名前: 必須項目

メールアドレス: 必須項目


ホームページアドレス: 必須項目

コメント: 必須項目

認証コード: 必須項目

※画像の中の文字を半角で入力してください。

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバックURL
https://fanblogs.jp/tb/6001978
※ブログオーナーが承認したトラックバックのみ表示されます。

※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
Build a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: