Aby zapisać w HTML wzór chemiczny H₂O₅, należy użyć tzw. indeksu dolnego (subscript), którego implementację umożliwia znacznik <sub>. Dzięki temu uzyskujemy poprawny i czytelny zapis stosowany w chemii i naukach przyrodniczych.
Podstawowy zapis wzoru – do stworzenia indeksu dolnego (czyli małej “2” i “5” pod literami) stosujemy składnię:
H<sub>2</sub>O<sub>5</sub> Efekt na stronie:
H₂O₅
Wyjaśnienie składni
<sub>– umieszcza tekst w indeksie dolnym. Tu używane dla „2” i „5”, by odpowiadać prawidłowemu zapisowi chemicznemu;- Wzory, w których liczby występują jako indeks dolny przy symbolu pierwiastka lub grupy, zawsze powinny być formatowane z użyciem
sub– zapewnia to czytelność i spójność z publikacjami naukowymi.
Praktyczne zastosowania zapisu indeksu dolnego w HTML
Wzory chemiczne w tekstach edukacyjnych i naukowych
- Stosuj w opisach związków chemicznych (np. H₂SO₄, CaCO₃),
- ułatwia rozumienie proporcji pierwiastków w związkach.
Prezentacje naukowe i dydaktyczne
- w materiałach edukacyjnych online, np. e-podręcznikach, quizach, zadaniach z chemii.
Tworzenie interaktywnych quizów lub ćwiczeń
- użytkownik wybiera spośród kilku sformatowanych wzorów,
- przykład fragmentu HTML do quizu:
<label><input type="radio" name="answer" value="1"> H<sub>2</sub>O</label>
<label><input type="radio" name="answer" value="2"> H<sub>2</sub>O<sub>5</sub></label>
Tabele właściwości chemicznych
- w tabelach wyników lub porównań, np. dla wyświetlenia wzoru chemicznego różnych substancji.
Rozszerzenia i dobre praktyki
- zachowaj spójność: we wszystkich wzorach chemicznych stosuj indeksy dolne, np. CO₂ jako
CO<sub>2</sub>; - w edytorach kodu warto korzystać ze skrótów (np. Emmet) dla szybszego wstawiania znaczników HTML;
- dla publikacji, w których pojawia się zarówno indeks dolny (
<sub>) jak i górny (<sup>– np. cząstki naładowane: NO3–), stosuj oba zgodnie z konwencją chemiczną.
Przykłady – kod HTML i efekt finalny
Przykład 1 –
<p>Wyznacz masę molową związku H<sub>2</sub>O<sub>5</sub>.</p> Efekt:
Wyznacz masę molową związku H₂O₅.
Przykład 2 –
<ul>
<li>Kwas siarkowy: H<sub>2</sub>SO<sub>4</sub></li>
<li>Tlenek węgla(IV): CO<sub>2</sub></li>
<li>Perytlenek wodoru: H<sub>2</sub>O<sub>5</sub></li>
</ul>
Efekt:
• Kwas siarkowy: H₂SO₄
• Tlenek węgla(IV): CO₂
• Perytlenek wodoru: H₂O₅
Wskazówki praktyczne
- upewnij się, że strona kodowana jest w UTF-8, aby poprawnie wyświetlać polskie znaki i symbole chemiczne,
- jeśli edytujesz kod bezpośrednio, kopiuj i wklejaj składniki wzorów ze sprawdzonego źródła lub generatora HTML.
Stosując powyższe zasady, uzyskasz czytelne, profesjonalne i zgodne ze standardami zapisy wzorów chemicznych, takie jak H₂O₅, do wykorzystania w tekstach, ćwiczeniach i materiałach edukacyjnych publikowanych w internecie.
