etykietki dla przycisku


292

Czy można utworzyć etykietkę przycisku HTML. Jest to zwykły przycisk HTML i nie ma atrybutu Tytuł, ponieważ istnieje on dla niektórych formantów HTML. Wszelkie myśli lub komentarze?

Odpowiedzi:


559

Po prostu dodaj titledo swojego button.

<button title="Hello World!">Sample Button</button>


9
@EduardLuca, W moim przypadku podpowiedź naprawdę nie działa na disabledprzyciskach, ponieważ Bootstrap ustawia się pointer-events: nonena stan wyłączony. Powinno działać, jeśli zostanie ustawione pointer-events: autobezpośrednio na element.
Vitaliy Alekask,

to także, że podpowiedź będzie miała na celu pokazanie dna, z którego znajduje się mysz. Jeśli więc element docelowy znajduje się w prawym dolnym rogu ekranu, etykieta narzędzia przesuwa się nad wskaźnikiem myszy. Mówiąc bardziej ogólnie: pozycja końcówki czasami nie jest inteligentna ... ale sądzę, że to tylko przeglądarki.
gideon

1
Są sytuacje, w których potrzebne są podpowiedzi , ale ważne jest, aby wziąć pod uwagę bazę użytkowników , korzystając z metody opisanej w tej odpowiedzi. Użyłem tego titleatrybutu do pokazania skrótu klawiaturowego dla przycisku, ponieważ skróty nie są konieczne i tylko urządzenia dotykowe nie używają klawiatury.
Dave F

ale to nie pokazuje podpowiedzi, kiedy używasz klawiatury, aby ustawić ostrość na przycisku, czy jest jakaś inna sztuczka, aby sobie z tym poradzić? Myślę, że to jest problem z dostępnością, nie?
Nikhil



12

Użyj titleatrybutu. Jest to standardowy atrybut HTML i domyślnie jest renderowany w podpowiedzi przez większość przeglądarek na komputery.


Problem, który czytam, podkreśla jednak, że atrybut title nie jest w pełni obsługiwany przez wiele przeglądarek mobilnych. Obecnie badam to również w związku z niektórymi problemami ADA i wydaje się, że jest to w pewnym stopniu obsługiwane.
Isaac wietrza

3
@isaacweathers Cóż, jak byś „unosił się” w przeglądarce mobilnej, aby wyświetlić tytuł?
mbomb007

@ mbomb007 -: stan skupienia na iOS z lektorem jest tak blisko atrybutu: najechanie, jak tylko możesz.
Pogoda w Iaac


10

Dla wszystkich, którzy szukają szalonego rozwiązania , po prostu spróbuj

title="your-tooltip-here"

w dowolnym tagu . Przetestowałem na td„i a” i to całkiem działa.


2
@ krillgar, podałem ogólne rozwiązanie, które działa nie tylko z przyciskiem, ale i innymi tagami. Moim zamiarem było wzmocnienie tej możliwości.
Davidson Lima

3
co do twojego ostatniego komentarza, to już była odpowiedź Skymana lata temu.
Pac0,

2

Przycisk akceptuje atrybut „tytuł”. Następnie możesz przypisać mu wartość, która ma się pojawiać, gdy najedziesz myszką na przycisk.

<button type="submit" title="Login">
Login</button>


1

Atrybut tytułu ma na celu dać więcej informacji. To nie jest przydatne dla SEO, więc nigdy nie jest dobrym pomysłem mieć ten sam tekst w tytule i alt, który ma opisywać obraz lub dane wejściowe w porównaniu do tego, co robi. na przykład:

<button title="prints out hello world">Sample Buttons</button>

<img title="Hms beagle in the straits of magellan" alt="HMS Beagle painting" src="hms-beagle.jpg" />

Atrybut tytułu utworzy podpowiedź, ale będzie kontrolowany przez przeglądarkę tak daleko, jak się pojawi i jak będzie wyglądać. Jeśli chcesz mieć większą kontrolę, istnieją opcje jQuery innych firm, wiele szablonów css, takich jak Bootstrap, ma wbudowane rozwiązania, a także możesz napisać proste rozwiązanie css, jeśli chcesz. sprawdź to rozwiązanie w3schools .


-1

Powinieneś użyć zarówno atrybutu title, jak i alt, aby działał we wszystkich przeglądarkach.

<button title="Hello World!" alt="Hello World!">Sample Button</button>

1
Dlaczego powinieneś używać obu?
Andrei Cioara,

ponieważ niektóre przeglądarki używają atrybutu alt i jakiegoś tytułu
Sergey Gurin

5
Nonsens. altAtrybut jest ważny tylko dla img, input type="image"i areaznaczniki.
bitbitdecker
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.