タグ 属性値
人気順 5 users 50 users 100 users 500 users 1000 usersタブやアコーディオンの非表示コンテンツにはhidden="until-found"を使うべし | TAKLOG
タブやアコーディオンの非表示コンテンツにはdisplay:noneがよく用いられますが、hidden="until-found"を利用するほうがメリットがあります。 hidden=“until-found”で非表示にしたコンテンツはページ内検索でアクセスできるhidden="until-found"はhidden属性に新たに追加された属性値です。 hidden - HTML: ハイパーテキ... 続きを読む
data-testidはいつ使うべきか?そもそも使うべきなのか? | フューチャー技術ブログ
Playwrightあるいはそのロケーターの元ネタとなっているTesting Libraryでは、DOMを指定する方法として data-testid 属性を扱ったクエリーを提供しています。どちらでも getByTestId(ID文字列) メソッドを使い、この属性値を使った要素の取得が行えます。しかし、ドキュメントを見ると、PlaywrightもTesting Libraryも、... 続きを読む
<form>の外側に送信ボタンを配置する
Web アプリなどの UI でよくあるのですが、フォームの外側に送信ボタンがあるようなデザインのときに HTML だけで解決する方法があるので紹介します。 form 属性で紐付け <input> 要素の form 属性に <form> 要素の id 属性値を指定することで、フォームと送信ボタンを関連づけられます。 <form id="signin"> <label> メ... 続きを読む
少しのコードで実装可能なHTML小技集
2022年4月8日 HTML これまで「少しのコードで実装可能な10のCSS小技集」シリーズでCSSのちょっとしたTipsを紹介していましたが、今回はHTMLバージョン!知っていると使い勝手がちょっとよくなる小技を集めました! ↓私が10年以上利用している会計ソフト! 目次 セレクトメニューの選択肢をグループ化 type 属性値によっ... 続きを読む
HTMLでhtmlタグやheadタグを省略してもいい場合がある、必須ではないHTMLのタグ・属性値のまとめ | コリス
<html>や</html>や<head>や</head>がないページを見たことはありませんか? 開始タグ<html>は最初の内容がコメントでなければ省略でき、終了タグ</html>は直後にコメントがなければ省略できます。また、<head>は内容が空か最初の内容が要素なら省略でき、</head>は直後に空白文字かコメントがなければ省略できます。 Web... 続きを読む
wildfire.vimでVim力を下げる - Weblog - Hail2u.net
wildfire.vimという、カーソルがある辺りのテキストオブジェクトをなんとなく選択してくれるVimプラグインを使い始めた。Vim力が下がる代わりに魂の平穏が得られる。ような気がする。 デフォルトではノーマル・モードで<Enter>を押すとカーソルのある辺りのテキストオブジェクトを選択してくれる。HTMLファイルを編集中なら属性値の上で発動させると、クオートの間を選択してくれる。その状態でもう... 続きを読む
serverspec でホスト固有の属性値を扱う方法 - Gosuke Miyashita
注意! ここで解説する方法は、現在の最新リリースである v0.2.26 ではまだ利用できません。host-attributes ブランチ にあるバージョンでのみ利用できます。 Provisioning Frameworks Casual Talks vol.1 に行ってきた #pfcasual - TAKUMI SAKAMOTO'S BLOG で触れられている attributes 周りについて、... 続きを読む
ちゃんと使い分けてる?alt属性とtitle属性の違いについて | クリエイティブメモメモ
こんにちは、井畑です。 今回は、alt属性とtitle属性についてです。この2つは、似たような意味合いのタグですが、実は用途が大きく違います。自分自身、最初のころは混同していたので、復習もかねて記事にしてみました。 よく使う属性値だからこそ、ちゃんと理解して使いたいですよね。 それではどうぞ! alt属性とtitle属性 alt属性とtitle属性は以下のように使われます。 HTML <!--al... 続きを読む
Dreamweaverで古いソースコードをクリーンアップする | バシャログ。
G.W. の開始とともにギックリ腰をやってしまい、連休中はずっと寝たきりで激痛と格闘していた sakai です。 温泉にでも行ってのんびりするかー、というささやかな夢すら叶わず無念… 今回は Dreamweaver で古いソースコードをクリーンアップする手順をご紹介します。 元のソースコードはこちら。 タグは大文字だし属性値を引用符で囲ってないし非推奨要素が使われているしインデントはグダグダだし、... 続きを読む
我的春秋: HTML エディタとしての Carbon Emacs
Dreamweaver などがまだ Intel Mac に対応していないこともあって、目下、色々なエディタを試用しながら、自分に合ったモノを探しています。ポイントは以下の通り。 Intel Mac + Tiger でも動作すること UTF-8 の読み書きに対応 GREP(正規表現検索や置換)ができること シンプルな UI 軽量・軽快なこと 要素・属性・属性値・コメントなどの色分け機能 要素名・属性... 続きを読む
IT戦記 - FireBug の新しいバージョンが便利すぎる件について
firefoxFireFox の拡張機能 FireBug を更新したらすごいことになっていたので共有します。 まずこれを見てくださいhttp://Sample.ECMAScript.jp/20060331.html ぱっと見の機能HTML のソースを見ながら、属性値を直接編集できる。 影響のある CSS を即時に表示 レイアウト情報を即時に表示 インスペクト中の要素に浮上したイベントをキャプチャ ... 続きを読む
HTMLの基本構造 - 仕様書に見るHTML(1)
3.3 属性リスト宣言と実体宣言 また、DTDでは要素タイプがどんな属性を持つのかも定義します。属性は、<!ATTLIST で始まる宣言文で、属性名、属性値のタイプ、省略時の扱いについて定義します。 さらにDTDでは、さまざまな名前や値の別名を定義しておき、個々の宣言ではこの別名を使うのが普通です。この別名の定義を実体宣言といい、<!ENTITY で始まる宣言で定義しています。 仕様書の3.3では... 続きを読む