HTML Structure/Navigation Bar - промяна в изгледа при наименуване на тагове и блокове
Здравейте,
реших да си поиграя с навигационния бар от тази лекция https://softuni.bg/trainings/resources/officedocument/12263/presentation-web-fundamentals-html5-january-2017/open (стр. 14) и имам следните случки и запитвания:
* Това е кодът, с който работя: https://codepen.io/anon/pen/ejoyaa
* Извинявам се ако бъркам терминологията, моля поправяйте ме ако забележите грешки.
1) Правилно и препоръчително ли е да наименувам таговете като например примерът отдолу, за да се конкретизира за коя навигация става въпрос, тъй като може да има и лява или дясна.
<nav class="nav-top">
2) Правилно и препоръчително ли е да наименувам и другите тагове като <ul> и <li> ако вземем предвид, че в кодът има също други листове и не искаме да обхващаме всички. Пример:
<ul class="nav-top-list">
<li class="nav-top-list-item"><a href="#">Home</a></li>
</ul>
3) Ако горните 2 точки са правилни и/или верни как ги декларираме правилно в CSS-файла без да променяме изгледа на html-файла, тъй като забелязах, че при промяна на имената на блоковете в CSS-a изгледът се променя, а всъщност са правилни и двата вариянта. Променете това, за да видите или просто декларирайте листовете с имената по-горе в CSS-a и ще се промени изгледа:
li:hover {
----->
li:hover а {
Ще се получи това(линкът отдолу) с разликата, че при картинката отляво в момента не мога да сложа черен цвят на текста като минавам отгоре с мишката докато отдясно мога, но искам изгледът на тази отляво:
http://prikachi.com/images.php?images/252/9384252c.png
4) Може ли да ми преправите базовият код по-горе да изглежда така както в момента, но когато минавам с мишката отгоре без да кликам и текстът да става черен, и също така изцяло да е правилно написан, за да видя как би изглеждал.
Благодаря предварително!