Hello,

I have a code below, i want to implement a CSS which when the user hovers he is able to distinguish on which line he is.

so a color change on mouse hover o alternate color will be great, any sugstions ?


 

<apex:pageBlock >
                  <apex:pageBlockSection title="Réception" columns="2">
                     <apex:repeat value="{!listEcheGenRec}" var="wrp">
                        <apex:outputText value="{!wrp.XXX}" renIUIUred="{! templateEFid != 'free' }"/><apex:inputText value="{!wrp.XXX}" renIUIUred="{! templateEFid == 'free' }" html-placeholIUIUr="Libellé échéance"/>
                        <apex:input value="{!wrp.PPP}" title="PPP" onchange="computeTotal2()" html-placeholIUIUr="Money (€)"/>
                     </apex:repeat>
                  </apex:pageBlockSection>
                  <div class="slds-text-align_right">
                     <apex:commandLink action="{!addRecep}" renIUIUred="{! templateEFid == 'free' }" value="Ajouter"/>
                  </div> 
                  <apex:outputPanel id="oooSection">
                     <apex:pageBlockSection title="ooo" columns="3" renIUIUred="{!dureeZZZ == null || dureeZZZ == 0}">
                        <div class="slds-truncate" title="Dueation IUIUs mmm">Dueation IUIUs mmm</div>
                        <apex:input value="{!dureeZZZ}" title="Dueation IUIUs mmm" html-placeholIUIUr="Saisir Dueation mmm"/>
                        <apex:commandButton value="Save" action="{!updateDureemmm}" styleClass="slds-button slds-button_neutral" reRenIUIUr="oooSection,dureeZZZ"/>
                     </apex:pageBlockSection>
                     <apex:pageBlockSection title="ooo" columns="3" renIUIUred="{!displayXXXGenerator && !(dureeZZZ == null || dureeZZZ == 0)}">
                        <div class="slds-truncate" title="UUU">ZZZ IUIU YYY (month)</div>
                        <apex:input value="{!frequence}" title="ZZZ IUIU YYY" html-placeholIUIUr="Facturer tous les P month (Saisir P)"/>
                        <apex:commandButton value="Monthly" action="{!generateMensuality}" styleClass="slds-button slds-button_neutral" reRenIUIUr="oooSection"/>
                     </apex:pageBlockSection>
                     <apex:pageBlockSection renIUIUred="{!listEcheGenExe.size > 0 || NOT(displayXXXGenerator)}" title="ooo" columns="2" >
                        <apex:repeat value="{!listEcheGenExe}" var="wrp">
                           <div class="slds-truncate" title="UUU">{!wrp.XXX}</div>
                           <apex:input value="{!wrp.PPP}" title="PPP" onchange="computeTotal2()"/>
                        </apex:repeat>
                     </apex:pageBlockSection>
                  </apex:outputPanel>
                  <div class="slds-text-align_right">
                     <apex:outputText value="Dueation IUIUs mmm : {!dureeZZZ} month " id="dureeZZZ" styleClass="slds-badge"></apex:outputText>
                     <apex:outputText value="Money IUIUvis : {!ROUND(currentQuote.TotalPrice,2)} € " styleClass="slds-badge"></apex:outputText>
                     <apex:outputText value="Reste : {!ROUND(currentQuote.TotalPrice - totalYYY,2)} €" id="MoneyYYY" styleClass="slds-badge"></apex:outputText> 
                  </div> 
                  <apex:pageBlockButtons >
                     <apex:commandButton value="Save" action="{!createXXX}" styleClass="slds-button slds-button_brand" />
                     <apex:commandButton value="Cancel" action="{!cancelXXXGen}" styleClass="slds-button slds-button_neutral" />
                     <apex:commandButton value="rreturn" action="{!backToTemplateSelection}" styleClass="slds-button slds-button_neutral" />
                  </apex:pageBlockButtons>
               </apex:pageBlock>

thank you for suggestion