이번에는 가장 입문적인 아이콘 검색창을 가져왔습니다. 아이콘 검색창을 만들 때 주의사항은 무엇인가요? 아래에서 실제 사례를 살펴보겠습니다.
아이콘이 포함된 가장 간단한 검색 상자
<!DOCTYPE html> <html > <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> form>input[type="search"]{ height: 50px; padding: 10px; padding-left: 50px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAAlElEQVR42oWQQRHEIAxF10ElVAISVgo3bCABCUhYCZWAhEpAQpoD6bzJhNnDO0DyyA8fEXkppXyVCpLViDUfyqVIQN9JFMY637hrlCySFauL21E7KVWbAIGx56rnSLqc5KPXSLo3kySalPhTygFhRDtFC09EIsMeZJSGBj7Qveh3OJW89syImiH%2BIO2BOJX0XwA2%2BQEL4pAhSX4aBQAAAABJRU5ErkJggg%3D%3D); background-repeat: no-repeat; background-size: 30px 30px; background-position:10px ; font-size: 20px; border: 1px #989898 solid; } </style> </head> <body> <form > <input type="search" /> </form> </body> </html>
이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 믿습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
관련 읽기:
JS가 동영상의 태그된 동영상 썸네일을 캡처할 수 있나요?
위 내용은 아이콘이 포함된 가장 간단한 검색창의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!