How do I add a Font Awesome icon to input field?

前端 未结 8 1716
野性不改
野性不改 2020-11-28 01:36

How do I use the search icon included in Font Awesome for input? I have a search feature on my site (based on PHPmotion), that I want to use for the search.

Here\'s

8条回答
  •  萌比男神i
    2020-11-28 02:21

    to work this with unicode or fontawesome, you should add a span with class like below, because input tag not support pseudo classes like :after. this is not a direct solution

    in html:

       
    
    

    in css:

    .button1 {
        background-color: #B9D5AD;
        border-radius: 0.2em 0 0 0.2em;
        box-shadow: 1px 0 0 rgba(0, 0, 0, 0.5), 2px 0 0 rgba(255, 255, 255, 0.5); 
        pointer-events: none;
        margin:1px 12px;    
        border-radius: 0.2em;    
        color: #333333;
        cursor: pointer;
        position: absolute;
        padding: 3px;
        text-decoration: none;   
    
    }
    

提交回复
热议问题