エンジニアのひよこ_level10

【毎日更新!】新卒3年目エンジニアブログです!

HTML

【HTML】tableタグの中のtrタグとかをひとまとめにしたいとき【760日目】

trタグをひとまとめにしたい <table> <tr>りんご</tr> <tr>ごりら</tr> <tr>ラッパ</tr> </table> こんな感じにHTMLが配置されてるときに、りんごとごりらをひとまとめにしたい。 例えば、こんな感じに出来たら問題なかった <table> <div class="hidden"> <tr>りんご</tr> <tr>ごりら</tr> </div> <tr>ラッパ</tr> </table> でも、tableタグの中でdivは書けないのでどうしよう…

【HTML】要素をテキスト入力可能にする属性contenteditable【629日目】

divとかの文字を変えたい 既存のページとかで、たまに文字変えたいなと思うときがありませんか。 いつも、開発者ツールとかで書き換えたりしてますか。 contenteditable <div contenteditable=true> contenteditableという属性を持つと、その属性を持った要素は、クリックとかすると、</div>…

【html・xhtml】noindexを書いてるのに、noindexが動かない対応【601日目】

noindexをつけたい Googleのbotさんに自サイトを見てもらって、Google検索とかで表示されるようにしてもらう(インデックス)ことはありますが、 たまーに見てほしくないページもあります。投稿完了画面とか。 そういうときに、こういうようなタグをつけます。 <meta name="robots" content="noindex"></meta>…

【HTML】<!DOCTYPE HTML>を書き忘れるとCSSが変わる?【557日目】

ハマったポイント とあるプロジェクトで、同じCSS、同じHTMLの構成だと思ったのに、 どうしても同じデザインにならない。なぜだ?ってなりました。 違いはDOCTYPE そして、コードを読んでいくと、違いとしてあったのは以下。 あれ!?DOCTYPEが違う!? 何…

【HTML】一部のフォームの情報をsubmitで送りたくないとき【508日目】

フォームで、一部を送信したくない こういうときありませんか。 <form> <input name="age" type="text"> <input name="name" type="text"> </form> ユーザーが条件を満たしてなかったので、 inputの外見だけ用意して、nameを入力させたくない。 もっというと、submitの中に情報を含ませたくない。 そういうときはどうするか。 disabledを…

【HTML】IEの時だけ文字を表示させるorさせないコード【319日目】

こんな時ありませんか ページを使っていたら、IE9以下だけ正しく動かない・・・ ページのデザインが崩れる・・・ そんな時、IE9以下だけこの文字を表示させないってコードを書きたい。 HTMLで分岐を書く これでOK! 注意 IE9までしか使えません!!! IE9以下は…

【HTML】typeに何も書かなかった時のbuttonタグの挙動。【295日目】

buttonタグについて質問されたので 昨日の記事でbuttonタグについて質問されたので。 よくある使い方 <form> <input></input> <button type="submit"></button> </form> これで、formのinputタグに書かれた内容を、pustで送る送信ボタンという使い方 typeを書かなかったら 自動的に、submitとして扱われます。 submitした…

【IE】Formタグのsubmitで二重送信されてエラーが出る【294日目】

こんなときがありました <form> <input></input> <button onClick="submit();"></button> </form> こんな感じの構成で、submitが想定通りに動かなかった。 私のときは、Laravelのバリデーションのエラーで、サーバーサイドを疑いそうになった。 ブラウザの問題なのに。 IEは二重送信をそのまま送る buttonタグのonClick()でsubm…

【HTML・JS】defer。書き順関係なく、HTMLの後にJSファイルを読み込む【227日目】

いつ使うの HTMLファイルの中でscriptタグでJSファイルを読み込むときで、 ・必ず読み込んでほしいとき ・HTMLを描画終わった後にJSファイルを読み込んでほしいとき 何書くの <script src="https://xxxxxx.jp/yyyyy.js" defer> scriptタグの最後にdeferを書く 何が起きてるの 通常:HTML読み込んでscriptタグ…

【html】inputのhidden属性が、毎回同じ値を出す?【218日目】

こんなコードがあったそうです。 <form> <input type="hidden" name="fruits" value="apple"> <button type="submit" value="送信"> <input type="hidden" name="fruits" value="orange"> <button type="submit" value="送信"> <input type="hidden" name="fruits" value="grape"> <button type="submit" value="送信"> </form> これで、どのボタンを押してもfr…

【HTML】inputタグの丸いボタン、radioボタンの書き方【214日目】

こんなやつ、見たことないですか? りんごみかん 1234あ、これ押せるので試してみてください。 radioボタンって言います これはラジオボタンと呼ばれているもので、 『必ず1つだけ選ぶ』選択肢で使います。 片方を押したら、もう片方が消えるとかですね。 …