Nadawanie stylu wyłączono za pomocą tylko CSS


Mam dziwną sytuację. Próbuję nadać styl wyłączonemu przyciskowi Enter, ponieważ mam irytujący wskaźnik myszy, który zmienia tekst na biały. To sprawia, że ​​jest to mylące dla użytkownika, ponieważ działa jak zwykły przycisk.
Wypróbowałem kilka rzeczy, głównie css i kilka jQuery. Chciałbym, jeśli to możliwe, zachować to w css.
To jest mój html, przepraszam, że jest w formie bota pomocniczego. 
{{ Form::submit('Change', array_merge($design_project->is_locked ? ['disabled' => 'disabled'] : [], ['class' => 'btn btn-blue span3'])) }}

i to właśnie generuje przeglądarka 
<input disabled="disabled" class="btn btn-blue span3" type="submit" value="Change">

i pracowałem nad czymś takim 
.btn:hover input[disabled], .btn:active input[disabled], .btn:focus input[disabled]{

 color:green

}

Każda pomoc byłaby świetna!
2021-03-02 Dodaj komentarz
Udostępnij to

Nie znaleziono powiązanych wyników

    Zaproszony:
    Anonimowy użytkownik

    Anonimowy użytkownik

    Potwierdzenie od:

    Powiedzmy, że masz 3 przyciski: 
    <input type="button" disabled="disabled" value="hello world">
    
<input type="button" disabled value="hello world">
    
<input type="button" value="hello world">

    Następujący CSS może służyć do stylizacji wyłączonego przycisku: 
    input[type="button"]:disabled{
    
 color:#000;
    
}

    Wpłynie to tylko na przycisk, który jest wyłączony.
    Aby zatrzymać zmianę koloru po najechaniu kursorem, możesz również użyć tego: 
    input[type="button"]:disabled:hover{
    
 color:#000;
    
}

    Możesz również tego uniknąć, używając css-reset.
    2021-03-02 0 0
    Udostępnij to
    Anonimowy użytkownik

    Anonimowy użytkownik

    Potwierdzenie od:

    Spacja w selektorze CSS podświetla elementy potomne. 
    .btn input

    To jest w zasadzie to, co napisałeś i wybierze elementy
    & < input & >
    wewnątrz dowolnego elementu, który ma klasę
    btn
    .
    Myślę, czego szukasz 
    input[disabled].btn:hover, input[disabled].btn:active, input[disabled].btn:focus

    Umożliwiłoby to wybór elementu
    & < input & >
    z atrybutem
    disabled
    i klasą
    btn
    w trzech różnych hover ,
    active
    i
    focus
    .
    2021-03-02 0 0
    Udostępnij to
    Anonimowy użytkownik

    Anonimowy użytkownik

    Potwierdzenie od:

    Użyj tego CSS (

    Przykład jsFiddle
    http://jsfiddle.net/5vnHX/446/
    ):
    input:disabled.btn:hover,
    
input:disabled.btn:active,
    
input:disabled.btn:focus {
    
 color: green
    
}

    Musisz napisać najbardziej zewnętrzny element po lewej stronie i najbardziej wewnętrzny element po prawej. 
    .btn: hover input: disabled
    wybierze wszystkie wyłączone elementy wejściowe zawarte w elemencie klasy
    btn
    , który aktualnie znajduje się nad użytkownikiem.
    Wolałbym
    : disabled
    zamiast
    [disabled]
    , zobacz to pytanie do dyskusji:

    czy powinienem używać pseudoklasy CSS: disabled czy selektora atrybutu [disabled], czy jest to kwestia opinii?
    https://coderoad.ru/20141450/
    Nawiasem mówiąc, Laravel (PHP) generuje HTML - a nie przeglądarkę.
    2021-03-02 0 0
    Udostępnij to
    Dlaczego jest złożony? 0 odpowiedzi zostało zwiniętych

    Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się

    Polityka prywatności: https://zweryfikowac.pl/Polityka-prywatnosci.pdf
    Copyright © 2023, All Rights Reserved