２つの画像を参照してください。

Aをお手本にしてb要素を付け加えたいのですが、Bのようにうまいこといきません。  
どのようにすればb要素を追加することができるのでしょうか。

A  
[![画像の説明をここに入力][1]][1]

B  
[![画像の説明をここに入力][2]][2]

画像を追加します。

[![画像の説明をここに入力][3]][3]

Htmlの黄色枠に作者がCSS欄で記述したものを入力すればいいのでしょうか。もし、そうなら間違っているのではなく、やり方に２つの方法があると思われますが。
CC BY-SA 4.0
2022-03-30T02:25:54.167
88093
2022-04-01T02:42:23.150
2022-04-01T02:42:23.150
28812
28812
question
html css google-chrome-devtools
HTMLのインライン修飾機能：elements.style
お手本にしている画像が実行しているのは、該当の要素の「スタイル」を変更するであり、  
ご自身がやりたいことが該当の要素自体を書き換えるかと思います。

やりたいことに対して、参考にしている資料が間違っています。

要素の変更をしたいのであれば  
画面右側のスタイルを変更するのではなくて  
左側のHTMLの画面で変更したい要素をダブルクリックして編集モードにして書き換えてみてください

[![画像の説明をここに入力](https://i.stack.imgur.com/gsnxl.jpg)](https://i.stack.imgur.com/gsnxl.jpg)

詳しくは以下を参照  
<https://developer.chrome.com/docs/devtools/dom/#type>
CC BY-SA 4.0
2022-03-30T03:12:38.100
88096
2022-03-31T01:14:52.850
2022-03-31T01:14:52.850
22665
22665
88093
answer