検索

1. <form id=”form” action=”自分のサイトURL” method=”get”>
2. <input id=”s-box” name=”s” type=”text” placeholder=”キーワードを入力”/>
3. <button type=”submit” id=”s-btn-area”><div id=”s-btn”>検索</div></button>
4. </form>

1. rm{
2. position:relative;
3. }
4. #s-box{
5. height: 40px;
6. padding: 0 10px;
7. position: absolute;
8. left: 0;
9. top: 0;
10. border-radius:2px;
11. border:solid 3px #eaeaea;
12. outline: 0;
13. }
14. #s-btn-area{
15. height: 50px;
16. position: absolute;
17. left:250px;
18. top: 0;
19. background:none;
20. color:#666;
21. border:none;
22. font-size:20px;
23. outline: 0;
24. }
25. #s-btn{
26. background-color: black;
27. width: 50px;
28. height: 30px;
29. position: relative;
30. right: 20px;
31. bottom: 10px;
32. border-radius: 3px;
33. font-size: 16px;
34. color: #fff;
35. line-height: 31px;
36. }

<?php get_search_form(); ?>