今さら聞けないHTML 2022年06月07日

今さら聞けないHTML 2022年06月07日

SVGをHTMLに埋め込むときのあれこれ

# SVGをHTMLに埋め込むときのあれこれ
デザイナーからSVGデータで表示させてほしいと言われても実際は色々面倒。。。
何が面倒ってもらったSVGデータをキレイにすることが一番面倒。。。
何を消していいか、どうやったら使ったらいいか、あれやこれやを記述します

## SVGデータから不要なデータを削除

### STEP 1. イラストレータで不要なものを削除(ほんとはデザイナーにやってもらいたい)
– 余白を削除(アートボードの調整)
– SP/PCで同じSVGデータを利用して画像をPCでは大きく見せたりする場合に余白があると調整が難しいため
– グループの解除
– SVGデータを少しでも軽くするため
– 色をCSSで調整する際にグループがあるとその部分だけ上手く反映されないことがあるため
– パスの結合
– 矢印の形などでデータを見ると三角▲と四角■のデータに分かれていることがあるが、SVGデータを少しでも軽くするためやCSSで色を変更するために結合することが望ましい
– 不要なレイヤーの削除
– 時々何も書かれていないレイヤーが含まれて

元記事を表示

初めてQiitaを使ってみた。(自己紹介)

## 初めに
初めまして。プログラミング学習歴1年のヒロシといいます。
HTML CSS jQuery JavaScript WordPressあたりがメインスキルです。

日々の学習の習慣の一つとして、コーディングでつまづいたところをアウトプットできればいいなと思いQiitaを始めてみました。

このQiita、Markdown記法なるもので記事を書けるみたいなので練習してみようと思います。

## 自己紹介
### 出身地・誕生日
福島県会津若松市にて1995年3月8日に生まれました。(27歳)

### 趣味
テキサスホールデムというポーカーにハマっています。アプリで遊んだり、たまにアミューズメントカジノに行って遊んだり・・・
家でぐうたらしているときはほとんど動画サイトでアニメかVtuberの切り抜き、配信を見ています。

## 大学卒業後〜現在について

### プログラミングに出会うまで

大学卒業後、予備校講師になりたいと思っていたので、集団塾の非常勤講師として2年間働いていました。プログラミングの学習を始めたのは卒業してから1年経ったあたりです。

### プログラミ

元記事を表示

TECH CAMP 1日目 ~キックオフ~

# 学習内容
tech campの1日目はキックオフと言って、学習カリキュラムをどのように進めていくのかなどを確認したり、メンバーやライフコーチと顔合わせします。
それが終わると、基礎学習を始めていきます。
今日学んだ内容は事前にProgateで予習した内容と殆ど一緒でした。内容に関して苦労したことはありませんでした。

– HTML,CSSの基本(レイアウト構造、ブロックレベル要素やインライン要素等)

## 今週の目標
__今週中に中間試験を実施__
学習カレンダー上は6/16だが今週の金曜日6/10までに行う。
早めに進めることで⇨余裕を持ってカリキュラムに取り組める
          就職活動で使うポートフォリオの作品制作に時間を注げられる

元記事を表示

HTMLの構成 progate

# 要素
要素で要素を入れることを“`入れ子“`

## 親要素
要素を囲む方を“`親要素“`

## 子要素
要素から囲まれる方を“`子要素“`

## インデント
親子関係を示すために囲む要素の開始タグからスペースを2つ(一般的に)付ける。
これを“`インデント“`
tabでつけられる。

元記事を表示

コピペで素早く学ぶ HTMLカルーセル

## 0. はじめに

HTML と CSS の機能のみでカルーセルを作成するチュートリアルを用意しました。理解の前に「動かす感覚」を味わってもらうため、**ほぼ全てコピー&ペーストのみで**、素早く進められるチュートリアルになっています。

### git レポジトリのクローン

:large_orange_diamond: Action: ターミナルで以下のコマンドを実行してください

“`terminal
git clone https://github.com/richardimaok

元記事を表示

バッティングスコア管理アプリをお喋り出来るようにする⚾

## バッティングスコアに機能を追加
この前記事で作成したアプリの機能を充実させるということで、より一層かっこいい感じにしようと思う。

https://qiita.com/long66tail/items/ab96b204c4ca7bea56b0

今回は、かっこよく英語で語らうようにしてみた。

## 完成作品
と、いうことで、打撃成績を”追加”したら、
「good job.Always put your best foot forward.(訳:お疲れ様。いつもベストを尽くしていこう)」
と言ってくれるようにした。

https://batting-statistic-c35a90.netlify.app/

## ソースコード

今日の天気とアニメは??音声認識で天気予報とEテレ番組を教えて貰ってみた

## 音声認識と発話ができるアプリを作りたい!
音声認識と発話を利用したWebアプリを作成した。
今回は前回の[天気予報アプリ(ライブカメラで渋谷を見てみた)](https://qiita.com/kosuke0517lab/items/be242454c517b10a176b)をもとに作成している。前回と違う点としては**音声認識と発話の技術** を用いており、視覚だけではなく聴覚からも天気予報を知ることができる。
それに加え、NHK番組表APIという面白そうなAPIを見つけたので取り入れてみることにした。ジャンルをEテレに絞っているのでおかあさんといっしょやおじゃる丸、忍たま乱太郎といったアニメが好きな**子供たちにも楽しんでもらえるはず**なのでぜひ使ってみてほしい。

## どんなアプリ
・[前回](https://qiita.com/kosuke0517lab/items/be242454c517b10a176b)と同様に今日、明日、明後日の天気を画像付きで表示をする。
・『~の天気は』と訊くとその日の天気を教えてくれる。もしその日が雨なら傘を持って行ってと提案してくれる。

元記事を表示

HTML5プロフェッショナル認定試験レベル1 Ver2.5 合格記

2022年6月上旬にHTML5プロフェッショナル認定資格レベル1 Ver2.5を受験し合格しました。

今年の4月に現在の会社にIT業界未経験として入社後、初めての資格試験として受験しました。

## 受験理由
もっとWeb全般の知識を深く体系的に身につけたいと思ったからです。独学で主にhtmlやcss, Javascriptを使って遊んでますが、用語は知っているが意味はあまり分からない等といった事が多々ありましたので今一度知識をしっかりと定着させたいと思いました。

## 試験概要

公式サイト: https://html5exam.jp/outline/lv1.html

90分(秘密保持契約とアンケートの時間を含む)
内訳:秘密保持契約5分、試験80分、アンケート5分
試験問題数
約60問
受験料
¥16,500(税込)

:::note warn
試験を受ける前はHPをよく見ておらず実際に問題を解く時間が90分だと勘違いしてました。
問題を解く事が出来る時間は80分です。
合格ラインは65点でした。
:::

## Ver2.5

2022年2月1日から従来のVer2.0から

元記事を表示

【JavaScript】セレクトボックスの要素を移動させる

今回はセレクトボックスの要素の移動について記述します。
この実装はJQueryでよく見かけるのですがJavaScriptで実装しているものがなかった為
メモを残したいと思います。

【view】

![【view】.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2665680/d31481b3-c84d-0c32-81c8-a4860c92bfcd.png)

![【view】ver2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2665680/64e3b6b8-b334-b70c-ab79-3eafe6a40ae5.png)

左のセレクトボックスの要素を選択して右のセレクトボックスに移動させます。
※逆も可能。

<【JavaScript】>

![【JS】コード1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/

元記事を表示

Web ページをベクタ形式で綺麗に保存する方法 (CSS の @media をいじってブラウザで印刷)

# 前提

画像ファイルにはラスタ形式とベクタ形式があります.
ラスタ形式はピクセル単位で画像データを管理しているため,拡大するとギザギザしてきます.PNG や JPEG などはラスタ形式です.
ベクタ形式は「座標 (10, 20) から座標 (60, 20) に直線を引く」みたいな感じで文字や図形を表現しているため,拡大しても綺麗なままです.SVG や EPS などはベクタ形式です.
PDF は基本的にベクタ形式ですが,ラスタ形式の画像を埋め込むことも可能です.

(と思っているのですが,画像形式の仕様について特別詳しいわけでないので,間違っていたら教えてください.)

# やりたいこと

Web ページをベクタ形式で保存したいです.普通の方法でスクリーンショットを撮るとラスタ形式になってしまいます.ラスタ形式は特に印刷すると汚くなってしまいます.

上述の通り,PDF はベクタ形式です.よって,ブラウザの印刷機能を使用して,プリンタの代わりに「PDF に保存」を選んであげれば Web ページをベクタ形式で保存できます.

# 困ったこと

一部のサイトは印刷を試みるとデザインが乱れ

元記事を表示

四捨五入、切り捨て、切り上げをしたい(Math)

## はじめに
現在、独学でJavaScriptを勉強中です。
`Mathオブジェクト`で躓いてしまったのでまとめてみました。

## よく使うMathオブジェクト
`Math.round` ・・・四捨五入する(戻り値 数値)
`Math.round()メソッド`は次のような挙動をする。
・小数点部分が0.5以上であれば、次に大きい整数へ切り上げ
・小数点部分が0.5以下であれば、次に小さい整数へ切り下げ
“`javascript
Math.round(5.34); //結果: 5
Math.round(6.8); //結果: 7
“`
`Math.floor` ・・・切り捨てる。数値以下の最大の整数を返す(戻り値 数値)
※少数の大小に関わらず切り捨てる。
“`javascript
Math.floor(5.34); //結果: 5
Math.floor(6.8); //結果: 6
“`
`Math.ceil` ・・・切り上げる。数値以上の最小の整数を返す(戻り値 数値)
※少数の大小に関わらず切り上げる。
“`javascript
Math.ceil(5.34); //結

元記事を表示

セレクトボックスの一部の項目を選択できなくする

# 見出し1
JavaScriptでセレクトボックスの一部を動的に選択できなくする方法を記載します。

# コード

“`HTML

“`

“`JavaScript
let items = Array.from(document.querySelectorAll(‘#selectbox option[data-val=”1″]’));
items.forEach(option => option.disabled = true);
“`

これでセレクトボックスのdata-valが1の項目が選択できなくなります。

元記事を表示

bootstrapで表示内容を中央揃えにする方法

こんにちは。

みなさんは普段htmlを書いていて、
一つ一つにcssを適用させるのめんどくさいなーと思ったことはありませんか?
本日はbootstropで、col内にまとめたhtmlの表示位置を
一括で管理する方法について理解できたので
アウトプットをしたいと思います。
参考資料も最後の方にあるので、そちらも目を通していただければと思います。

表示させたい内容はこちら![スクリーンショット 2022-06-04 14.34.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2687611/89af7d05-7b30-3fe4-1f9d-72daf0b79785.png)
こちらのDMの表示位置をbootstrapを使って一括管理する方法を
アウトプットしていきたいと思います。
(bootstrapに関しては調べれば出てくると思うのでここでは割愛します)

グリッドシステムを利用した中央揃え

bootstrapのグリッドシステムにより画面が12分割されていることは

元記事を表示

Re:ゼロから始めるSNS作り生活(一週間目+α)

# ☆どんな記事?☆
プログラミング初心者が、イチからSNSサイトを構築する過程を記録したもの。
誰かに「勉強の状況はどう?」と訊かれたときに提示できるよう、Qiitaの記事として投稿しています。
# ☆前置きや前提☆
### 完成品のイメージ
– コンセプトは「勉強記録をポストしたり、問題を出しあったりできるSNS」
– 自分の勉強記録をポストし、閲覧できる
– 友人の勉強記録に対し、コメントやミニクイズを投稿できる(本記事では未実装)
– 自分と似た目標を持つユーザーを検索し、フォローできる(本記事では未実装)
– フォローしている人の勉強記録を一覧表示する「タイムライン」もある(本記事では未実装)
– 当然レスポンシブデザイン(本記事では未実装)
### 制作の目的
– プログラミング技術の向上
– あわよくば友人にこのSNSを使ってもらいたい
### これまでの経験や知識
– WordPressで構築されたサイトの調整経験
(2年弱従事していたため、HTML・CSS・PHPとも基礎はわかっていたつもり)
(通信をはじめバックグラウンドの知識はゼロ)
– 大昔にイチからサイトを構

元記事を表示

Nginxに静的ファイルをデプロイしてみよう

## はじめに
Docker でHTML ファイルを nginx 起動しngrock で簡単にhttps 起動できるまでを記載しています。

## フォルダ構成

“`
root/
├── Dockerfile
└── src
└── index.html
“`

## 各ファイル設定

1. Dockerfile を用意する

“`Dockerfile
FROM nginx:1.15.0

COPY ./src /usr/share/nginx/html
“`

2. src/index.html ファイルを用意する

“`html






html ファイル</title</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>HTTP</div> <div class='tag-cloud-link'>Docker</div> <div class='tag-cloud-link'>HTTPS</div> <div class='tag-cloud-link'>ngrok</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/harururu32/items/7b10b4204e0245c021ab'>元記事を表示</a></div> <h3 id="outline__1_0_7"><a href='https://qiita.com/culage/items/83d28ef47a76a6e31f74'>viewport完全に理解した</a></h3> <blockquote><p>■概要<br /> ——————————</p> <p>htmlでスマホレイアウトをするときは`viewport`を指定するが、微妙に思い通りの動きをしてくれないので、動きをまとめてみた。</p> <p>viewportはスマホ画面に、どんな大きさのhtmlレイアウト領域(=ビューポート)を、どんな倍率で表示するかを指定するための設定。<br /> 例: `<meta name="viewport" content="width=device-width,initial-scale=1">`</p> <p>■device-widthについて<br /> ——————————</p> <p>スマホの横幅を、論理ピクセル数で示した値。</p> <p>スマホは解像度が高いので、論理ピクセル数=物理ピクセル数(デバイスピクセル)ではない。<br /> 例えば`width:100px`の要素は100論理ピクセルの幅を持つが、スマホ液晶上では100以上の物理ピクセルによって表示される。<br /> `device-width`は、この論理ピクセル数で画面幅を示す。</p> <p>■viewportの指定方法(width、initial-s</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>Mobile</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/culage/items/83d28ef47a76a6e31f74'>元記事を表示</a></div> <h3 id="outline__1_0_8"><a href='https://qiita.com/masatom86650860/items/ffe1751d415cc0bd187c'>タグの種類</a></h3> <blockquote><p>## “`</p> <p>“` ピータグ<br /> 文章を記載する時に使用<br /> “`html</p> <p>…</p> <p>“`</p> <p>## “`</p> <h1>, </p> <h2>, …, </p> <h6>“` エイチワン~エイチシックス<br /> “`html</p> <h1>…</p> <h1> “`</p> <p>## “`<a>“` 「アンカー」や「エータグ」<br /> 他のページやサイト、ファイルなどにリンクさせる<br /> “`html<br /> <a>…</a><br /> “`<br /> ## “`<img>“` イメージタグ<br /> 画像を扱う時に使用<br /> “`html<br /> <img>…</img><br /> “`</p> <p>## “`</p> <li>“` リストタグ<br /> 箇条書きしたいテキストをこのタグで囲むことによってリストを作ることができる。<br /> “`html</p> <ul> <li>..</li> <li>..</li> </ul> <p>“`<br /> ## “`</p> <ul>“` ユーエルタグやアンオーダーリスト<br /> 黒点が先頭につきます<br /> “`html</p> <ul> <li>..</li> <li>..</li> </ul> <p>“`<br /> ## “`</p> <ol>“` オーエルタグやオーダータグ<br /> 数字が連番でつきます</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>初心者</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/masatom86650860/items/ffe1751d415cc0bd187c'>元記事を表示</a></div> <h3 id="outline__1_0_9"><a href='https://qiita.com/ryomoucmei/items/1ea8c48a5cfdaa861f26'>linkタグメディア属性min-widthの挙動を調べてみた</a></h3> <blockquote><p>linkタグメディア属性でウィンドウサイズによってCSSを切り替えることができますが疑問が出てきたのでテストしてみました。<br /> ソースは以下になります。</p> <p>“`html<br /> <head> <link rel="stylesheet" href="/wp-content/themes/mytest/lessthan767.css" type="text/css" media="(max-width:767px)" /> <link rel="stylesheet" href="/wp-content/themes/mytest/morethan768.css" type="text/css" media="(min-width:768px)" /> </head><br /> “`</p> <p>それぞれのcssでは背景色を指定してるのみのシンプルなスタイル指定です。<br /> media属性でウィンドウの横幅を指定してスタイルを分けているという形になります。</p> <p># 疑問1|ファイルは必ず読み込まれるのか?<br /> 仮にウィンドウの横幅が500pxだったとしてmorethan768.cssは読み込まれるのか?<br /> もし読</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>CSS</div> <div class='tag-cloud-link'>高速化</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/ryomoucmei/items/1ea8c48a5cfdaa861f26'>元記事を表示</a></div> <h3 id="outline__1_0_10"><a href='https://qiita.com/aliciaetfleurs/items/15831d79bd880e5d1404'>HTMLのclassとidの使い方</a></h3> <blockquote><p># HTMLのclassとidの使い方</p> <p>– **idは(親)タグにつける場所名**<br /> – **classはデザインを管理するためのデザイン名**<br /> ### セレクタの詳細度 (優先順位)<br /> |セレクタ|点数|内容|<br /> |—|—|—|<br /> |idセレクタ|1.0.0|#OO|<br /> |クラスセレクタ<br />style属性<br />疑似要素|0.1.0|.OO<br />`<タグ style="OO:OO;">`<br />`:hover`, `:visited`など|<br /> |タグセレクタ<br />疑似要素|0.0.1|`</p> <p>`や`<a>`など<br />`::before`,`::after`など|</p> <p>style属性が**1番優先度が高い。**<br /> CSSのどこに書くかでタグの優先度が変わる</p> <p>2番目がHTMLタグの中にあるタグ<br /> 3番目がCSSファイルの中にあるもの</p> <hr> <p>### CSSのセレクタの優先順位と点数<br /> – `a:link{ color:blue; }` **タグセレクタ+疑似クラス +11**<br /> – `nav_a{ color:green; }` **タグセレクタ+タグセレクタ +2**<br /> – `a</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>CSS</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/aliciaetfleurs/items/15831d79bd880e5d1404'>元記事を表示</a></div> <h3 id="outline__1_0_11"><a href='https://qiita.com/degudegu2510/items/a28383fd334a976c7ad8'>【CSS】CSS Grid Layoutの新機能「サブグリッド」の使い方 – CSS Grid</a></h3> <blockquote><p>## 概要<br /> 今まで、Firefoxでしか実装されていなかった、<br /> CSS Grid Layoutの新機能「サブグリッド」が、[Interop 2022](https://web.dev/interop-2022/)の取り組みによって、<br /> 主要ブラウザすべてで、サポートされようとしています。</p> <p>それに伴い、CSS Grid Layoutの新機能「サブグリッド」の使い方についてまとめました。</p> <p>## サブグリッド `subgrid`<br /> サブグリッド `subgrid` とは、CSS Grid Layoutの新機能になります。<br /> そのため、サブグリッドの説明する前に、CSS Grid Layoutについて復習しましょう。</p> <p>### CSS Grid Layoutとは?</p> <p>CSS Grid Layoutは、列と行を定義することで、<br /> 水平線と垂直線が交差したレイアウト(グリッド)をCSSで表現したものになります。</p> <p>親要素に`display: grid;`を記載することで下の画像のように<br /> 親要素をグリットコンテナーとして、子要素をグリットアイテムとして扱うことができます。<br /> ![image.png](ht</p></blockquote> </blockquote> <aside class='widget widget-post'> <div class='tag-cloud-link'>HTML</div> <div class='tag-cloud-link'>CSS</div> <div class='tag-cloud-link'>Design</div> <div class='tag-cloud-link'>デザイン</div> <div class='tag-cloud-link'>QiitaEngineerFesta2022</div> </aside> <div><a style='width:100%;' class='btn__link' href='https://qiita.com/degudegu2510/items/a28383fd334a976c7ad8'>元記事を表示</a></div> </div> </section> <!-- 記事下シェアボタン --> <aside> <ul class="socialList"> <li class="socialList__item"><a class="socialList__link icon-facebook" href="http://www.facebook.com/sharer.php?u=https%3A%2F%2Ffactor.xseed.link%2F2022%2F06%2F07%2Fpost-19706%2F&t=%E4%BB%8A%E3%81%95%E3%82%89%E8%81%9E%E3%81%91%E3%81%AA%E3%81%84HTML%E3%80%802022%E5%B9%B406%E6%9C%8807%E6%97%A5" target="_blank" title="Facebookで共有"></a></li><li class="socialList__item"><a class="socialList__link icon-twitter" href="http://twitter.com/intent/tweet?text=%E4%BB%8A%E3%81%95%E3%82%89%E8%81%9E%E3%81%91%E3%81%AA%E3%81%84HTML%E3%80%802022%E5%B9%B406%E6%9C%8807%E6%97%A5&https%3A%2F%2Ffactor.xseed.link%2F2022%2F06%2F07%2Fpost-19706%2F&url=https%3A%2F%2Ffactor.xseed.link%2F2022%2F06%2F07%2Fpost-19706%2F" target="_blank" title="Twitterで共有"></a></li><li class="socialList__item"><a class="socialList__link icon-line" href="http://line.naver.jp/R/msg/text/?%E4%BB%8A%E3%81%95%E3%82%89%E8%81%9E%E3%81%91%E3%81%AA%E3%81%84HTML%E3%80%802022%E5%B9%B406%E6%9C%8807%E6%97%A5%0D%0Ahttps%3A%2F%2Ffactor.xseed.link%2F2022%2F06%2F07%2Fpost-19706%2F" target="_blank" title="LINEで送る"></a></li></ul> </aside> <!-- /記事下シェアボタン --> <!-- 記事下エリア[widget] --> <aside class="widgetPost widgetPost-bottom"><aside class="widget widget-post"><h2 class="heading heading-primary">タグ</h2><div class="tagcloud"><a href="https://factor.xseed.link/tag/%e3%81%9d%e3%81%ae%e4%bb%96/" class="tag-cloud-link tag-link-13 tag-link-position-1" style="font-size: 8pt;" aria-label="その他 (1個の項目)">その他</a></div> </aside></aside> <!-- /記事下エリア[widget] --> <!-- 関連記事 --> <aside class="related"><h2 class="heading heading-primary">関連する記事</h2><ul class="related__list"> <li class="related__item"> <a class="related__imgLink" href="https://factor.xseed.link/2020/07/10/post-6269/" title="JAVA関連のことを調べてみた2020年07月10日"> <img src="https://factor.xseed.link/wp-content/uploads/2019/10/java-150x150.jpg" alt="JAVA関連のことを調べてみた2020年07月10日" width="150" height="150" > </a> <h3 class="related__title"> <a href="https://factor.xseed.link/2020/07/10/post-6269/">JAVA関連のことを調べてみた2020年07月10日</a> <span class="icon-calendar">2020.07.10</span> </h3> <p class="related__contents">目次 1. SpringBoot2.3.0以降で@PropertySourceのvalueに使用しているプレースホルダの解決に失敗する2. 電卓プログ[…]</p> </li> <li class="related__item"> <a class="related__imgLink" href="https://factor.xseed.link/2021/05/30/post-11258/" title="JAVA関連のことを調べてみた2021年05月30日"> <img src="https://factor.xseed.link/wp-content/uploads/2019/10/java-150x150.jpg" alt="JAVA関連のことを調べてみた2021年05月30日" width="150" height="150" > </a> <h3 class="related__title"> <a href="https://factor.xseed.link/2021/05/30/post-11258/">JAVA関連のことを調べてみた2021年05月30日</a> <span class="icon-calendar">2021.05.30</span> </h3> <p class="related__contents">目次 1. Javaで1行に複数個の文字列を入力する方法2. GWT の domino-ui がカッコイイ3. VSCode-いろいろな言語の環境構築[…]</p> </li> <li class="related__item"> <a class="related__imgLink" href="https://factor.xseed.link/2021/07/23/post-11614/" title="JAVA関連のことを調べてみた2021年07月23日"> <img src="https://factor.xseed.link/wp-content/uploads/2019/10/java-150x150.jpg" alt="JAVA関連のことを調べてみた2021年07月23日" width="150" height="150" > </a> <h3 class="related__title"> <a href="https://factor.xseed.link/2021/07/23/post-11614/">JAVA関連のことを調べてみた2021年07月23日</a> <span class="icon-calendar">2021.07.23</span> </h3> <p class="related__contents">目次 1. 【Java発展学習17日目】SwingによるウィンドウUI制御2. 「ごく普通の文系大学生がIphoneアプリエンジニアになるまで」#1 […]</p> </li> </ul></aside> <!-- /関連記事 --> <!-- コメント --> <!-- /コメント --> <!-- PVカウンター --> <!-- /PVカウンター --> </main> <!-- /l-main --> <!-- l-sidebar --> <div class="l-sidebar"> <aside class="widget"> <div class="searchBox"> <form class="searchBox__form" method="get" target="_top" action="https://factor.xseed.link/" > <input class="searchBox__input" type="text" maxlength="50" name="s" placeholder="記事検索"><button class="searchBox__submit icon-search" type="submit" value="search"> </button> </form> </div></aside> <div id="wij_weather_in_japan"> <div id="wij_container" class="count3"> <p class="location">の天気</p> <ul> <li id=""> <p class="dateLabel"></p> <img class="panel" src="" alt=""> <p class="ttl"></p> <p class="thermometer"><span>--℃</span> / <span>--℃<span></p> </li> <li id=""> <p class="dateLabel"></p> <img class="panel" src="" alt=""> <p class="ttl"></p> <p class="thermometer"><span>--℃</span> / <span>--℃<span></p> </li> <li id=""> <p class="dateLabel"></p> <img class="panel" src="" alt=""> <p class="ttl"></p> <p class="thermometer"><span>--℃</span> / <span>--℃<span></p> </li> </ul> </div> </div> <aside class="widget"> <div class="textwidget"> </div> </aside><aside class="widget"><h2 class="heading heading-widget">Category</h2> <ul> <li class="cat-item cat-item-1"><a href="https://factor.xseed.link/category/other/">OTHER</a> </li> </ul> </aside><aside class="widget"><h2 class="heading heading-widget">Back number</h2> <ul> <li><a href='https://factor.xseed.link/2022/11/'>2022年11月</a></li> <li><a href='https://factor.xseed.link/2022/10/'>2022年10月</a></li> <li><a href='https://factor.xseed.link/2022/09/'>2022年9月</a></li> <li><a href='https://factor.xseed.link/2022/08/'>2022年8月</a></li> <li><a href='https://factor.xseed.link/2022/07/'>2022年7月</a></li> <li><a href='https://factor.xseed.link/2022/06/'>2022年6月</a></li> <li><a href='https://factor.xseed.link/2022/05/'>2022年5月</a></li> <li><a href='https://factor.xseed.link/2022/04/'>2022年4月</a></li> <li><a href='https://factor.xseed.link/2022/03/'>2022年3月</a></li> <li><a href='https://factor.xseed.link/2022/02/'>2022年2月</a></li> <li><a href='https://factor.xseed.link/2022/01/'>2022年1月</a></li> <li><a href='https://factor.xseed.link/2021/12/'>2021年12月</a></li> <li><a href='https://factor.xseed.link/2021/11/'>2021年11月</a></li> <li><a href='https://factor.xseed.link/2021/10/'>2021年10月</a></li> <li><a href='https://factor.xseed.link/2021/09/'>2021年9月</a></li> <li><a href='https://factor.xseed.link/2021/08/'>2021年8月</a></li> <li><a href='https://factor.xseed.link/2021/07/'>2021年7月</a></li> <li><a href='https://factor.xseed.link/2021/06/'>2021年6月</a></li> <li><a href='https://factor.xseed.link/2021/05/'>2021年5月</a></li> <li><a href='https://factor.xseed.link/2021/04/'>2021年4月</a></li> <li><a href='https://factor.xseed.link/2021/03/'>2021年3月</a></li> <li><a href='https://factor.xseed.link/2021/02/'>2021年2月</a></li> <li><a href='https://factor.xseed.link/2021/01/'>2021年1月</a></li> <li><a href='https://factor.xseed.link/2020/12/'>2020年12月</a></li> <li><a href='https://factor.xseed.link/2020/11/'>2020年11月</a></li> <li><a href='https://factor.xseed.link/2020/10/'>2020年10月</a></li> <li><a href='https://factor.xseed.link/2020/09/'>2020年9月</a></li> <li><a href='https://factor.xseed.link/2020/08/'>2020年8月</a></li> <li><a href='https://factor.xseed.link/2020/07/'>2020年7月</a></li> <li><a href='https://factor.xseed.link/2020/06/'>2020年6月</a></li> <li><a href='https://factor.xseed.link/2020/05/'>2020年5月</a></li> <li><a href='https://factor.xseed.link/2020/04/'>2020年4月</a></li> <li><a href='https://factor.xseed.link/2020/03/'>2020年3月</a></li> <li><a href='https://factor.xseed.link/2020/02/'>2020年2月</a></li> <li><a href='https://factor.xseed.link/2020/01/'>2020年1月</a></li> <li><a href='https://factor.xseed.link/2019/12/'>2019年12月</a></li> <li><a href='https://factor.xseed.link/2019/11/'>2019年11月</a></li> <li><a href='https://factor.xseed.link/2019/10/'>2019年10月</a></li> </ul> </aside> </div> <!-- /l-sidebar --> </div> <!-- /l-wrapper --> <div class="categoryBox"> <div class="container"> <h2 class="heading heading-primary"> <span class="heading__bg u-txtShdw bgc-darkgray">OTHER</span>カテゴリの最新記事 </h2> <ul class="categoryBox__list"> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24624/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/11/lock.png" alt="今さら聞けないセキュリティ 2022年11月30日" width="300" height="250" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24624/">今さら聞けないセキュリティ 2022年11月30日</a> </h2> </li> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24622/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/11/PAK_MT9V9A6975-730x410.jpg" alt="今さら聞けないHTML 2022年11月30日" width="730" height="410" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24622/">今さら聞けないHTML 2022年11月30日</a> </h2> </li> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24620/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/11/20141020203524-730x334.png" alt="今さら聞けないGit 2022年11月30日" width="730" height="334" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24620/">今さら聞けないGit 2022年11月30日</a> </h2> </li> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24618/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/11/967637031-book-168824_1920-YEnY-1920x1280-MM-100-730x410.jpg" alt="ITエンジニアが読むべき技術書 2022年11月30日" width="730" height="410" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24618/">ITエンジニアが読むべき技術書 2022年11月30日</a> </h2> </li> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24616/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/11/967637031-book-168824_1920-YEnY-1920x1280-MM-100-730x410.jpg" alt="WEBエンジニアが読んでおきたい技術書 2022年11月30日" width="730" height="410" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24616/">WEBエンジニアが読んでおきたい技術書 2022年11月30日</a> </h2> </li> <li class="categoryBox__item"> <div class="eyecatch eyecatch-archive"> <a href="https://factor.xseed.link/2022/11/30/post-24614/"> <img src="https://factor.xseed.link/wp-content/uploads/2019/10/ios-554x410.png" alt="iOS関連のことを調べてみた2022年11月30日" width="554" height="410" > </a> </div> <ul class="dateList dateList-archive"> <li class="dateList__item icon-calendar">2022.11.30</li> </ul> <h2 class="heading heading-archive "> <a class="hc-darkgray" href="https://factor.xseed.link/2022/11/30/post-24614/">iOS関連のことを調べてみた2022年11月30日</a> </h2> </li> </ul> </div> </div> <!-- schema --> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "Article ", "mainEntityOfPage":{ "@type": "WebPage", "@id": "https://factor.xseed.link/2022/06/07/post-19706/" }, "headline": "今さら聞けないHTML 2022年06月07日", "image": { "@type": "ImageObject", "url": "https://factor.xseed.link/wp-content/uploads/2019/10/ios-554x410.png", "height": "410", "width": "554" }, "datePublished": "2022-06-07T14:54:42+0900", "dateModified": "2022-06-07T14:54:42+0900", "author": { "@type": "Person", "name": "editor" }, "publisher": { "@type": "Organization", "name": "f@ctor", "logo": { "@type": "ImageObject", "url": "", "width": "", "height":"" } }, "description": "目次 0.0.1. SVGをHTMLに埋め込むときのあれこれ0.0.2. 初めてQiitaを使ってみた。(自己紹介)0.0.3. TECH CAMP 1日目 ~キックオフ~0.0.4. HTMLの構成 progate0.0.5. コピペで素早く学ぶ HTMLカルーセル0.0.6. バッティングスコア管理アプリをお喋り出来るようにする⚾0.0.7. 今日の天気とアニメは??音声認識で天気予報とEテレ […]" } </script> <!-- /schema --> <!--l-footer--> <footer class="l-footer"> <div class="container"> <div class="pagetop u-txtShdw"><a class="pagetop__link" href="#top">Back to Top</a></div> <div class="widgetFoot"> <div class="widgetFoot__contents"> </div> <div class="widgetFoot__contents"> <aside class="widget widget-foot"><h2 class="heading heading-footer">タグ</h2><div class="tagcloud"><a href="https://factor.xseed.link/tag/%e3%81%9d%e3%81%ae%e4%bb%96/" class="tag-cloud-link tag-link-13 tag-link-position-1" style="font-size: 8pt;" aria-label="その他 (1個の項目)">その他</a></div> </aside> </div> <div class="widgetFoot__contents"> </div> </div> <div class="copySns "> <div class="copySns__copy"> © Copyright 2022 <a class="copySns__copyLink" href="https://factor.xseed.link">f@ctor</a>. <span class="copySns__copyInfo u-none"> f@ctor by <a class="copySns__copyLink" href="http://fit-jp.com/" target="_blank">FIT-Web Create</a>. Powered by <a class="copySns__copyLink" href="https://wordpress.org/" target="_blank">WordPress</a>. </span> </div> </div> </div> </footer> <!-- /l-footer --> <link rel='stylesheet' id='weather-in-japan-css' href='https://factor.xseed.link/wp-content/plugins/weather-in-japan/stylesheets/style.css?ver=5.2-beta2-45163' type='text/css' media='all' /> <script type='text/javascript' src='https://factor.xseed.link/wp-includes/js/wp-embed.min.js?ver=5.2-beta2-45163'></script> <script type='text/javascript' src='https://factor.xseed.link/wp-includes/js/comment-reply.min.js?ver=5.2-beta2-45163'></script> <script> function toggle__search(){ extra__search.className="l-extra"; extra__menu.className="l-extraNone"; menuNavi__search.className = "menuNavi__link menuNavi__link-current icon-search "; menuNavi__menu.className = "menuNavi__link icon-menu"; } function toggle__menu(){ extra__search.className="l-extraNone"; extra__menu.className="l-extra"; menuNavi__search.className = "menuNavi__link icon-search"; menuNavi__menu.className = "menuNavi__link menuNavi__link-current icon-menu"; } </script><script>Array.prototype.forEach.call(document.getElementsByClassName("css-async"),function(e){e.rel = "stylesheet"});</script> </body> </html>