我在我的网站上使用wordpress插件联系form7插件用于所有表单。
表格的链接
现在我想在表格的字段中添加一些字体图标，如highcodetechnolabs dot com / test-contact
尽快帮我解决问题。以下是我为表单自定义
编写的代码 <style>
.wpcf7-form {
background:#D8D8D8;
border-radius:3px;
width:650px;
padding: 8px 8px;
margin-
bottom:5px;
}
</style>
<style>
#textarea {
height: 40px;
width: 270px;
background:#FFFFFF; moon-user;
border: medium none #089AE6;
text-transform: uppercase;
placeholder: moon-user;
}
</style>
<style>
#textarea1 {
height: 180px;
width:600px;
background:#FFFFFF
}
</style>
<style>
.wpcf7-submit {
background:#FA5858;
border-top: none;
border-bottom: none;
border-left: none;
border-right: none;
border-radius: 0px;
width:220px;
height:250px
margin:7px 0;
padding: 8px 8px;
color:#fff;
font-size:20px
}
</style>
<style>
table {border: none;}
</style>
<style>
table, tr, td {
background: transparent;
color: #000;
}
</style>
<style>
i
{
padding: 5px 10px;
display: inline-block;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;
border-radius: 100px;
-moz-box-shadow: 0px 0px 2px #888;
-webkit-box-shadow: 0px 0px 2px #888;
box-shadow: 0px 0px 2px #888;
}
</style>
<font color="#000000" face="verdana" size="5">Your Contact Information</font>
<table>
<tr>
<td>[text* name id:textarea class:wpcf7-form placeholder "* Your Name"]</td>
<td>[email* email id:textarea class:wpcf7-form placeholder "* Your Email"]</td>
</tr>
<table>
<tr>
<td>[tel* telephone id:textarea class:wpcf7-form placeholder "* Your Phone"]</td>
<td>[text companyname id:textarea class:wpcf7-form placeholder "Company Name"]</td>
</tr>
</table>
<table>
<tr>
<td>
[select* country id:textarea class:wpcf7-form "*Please Select Your Country" "Afghanistan" "Aland
Islands" "Albania" "Algeria" "American Samoa" "Andorra" "Angola" "Anguilla" "Antarctica"
"Antigua And Barbuda" "Argentina" "Armenia" "Aruba" "Australia" "Austria" "Azerbaijan" "Bahamas"
"Bahrain" "Bangladesh" "Barbados" "Belarus" "Belgium" "Belize" "Benin" "Bermuda" "Bhutan"
"Bolivia" "Bosnia And Herzegovina" "Botswana" "Bouvet Island" "Brazil" "British Indian Ocean
Territory" "Brunei Darussalam" "Bulgaria" "Burkina Faso" "Burundi" "Cambodia" "Cameroon"
"Canada" "Cape Verde" "Cayman Islands" "Central African Republic" "Chad" "Chile" "China"
"Christmas Island" "Cocos (Keeling) Islands" "Colombia" "Comoros" "Congo" "Congo, The Democratic
Republic Of The" "Cook Islands" "Costa Rica" "Cote D'Ivoire" "Croatia" "Cuba" "Cyprus" "Czech
Republic" "Denmark" "Djibouti" "Dominica" "Dominican Republic" "Ecuador" "Egypt" "El Salvador"
"Equatorial Guinea" "Eritrea" "Estonia" "Ethiopia" "Falkland Islands (Malvinas)" "Faroe Islands"
"Fiji" "Finland" "France" "French Guiana" "French Polynesia" "French Southern Territories"
"Gabon" "Gambia" "Georgia" "Germany" "Ghana" "Gibraltar" "Greece" "Greenland" "Grenada"
"Guadeloupe" "Guam" "Guatemala" "Guernsey" "Guinea" "Guinea-Bissau" "Guyana" "Haiti" "Heard
Island And Mcdonald Islands" "Holy See (Vatican City State)" "Honduras" "Hong Kong" "Hungary"
"Iceland" "India" "Indonesia" "Iran, Islamic Republic Of" "Iraq" "Ireland" "Isle Of Man" "Israel"
"Italy" "Jamaica" "Japan" "Jersey" "Jordan" "Kazakhstan" "Kenya" "Kiribati" "Korea, Democratic
People'S Republic Of" "Korea, Republic Of" "Kuwait" "Kyrgyzstan" "Lao People'S Democratic
Republic" "Latvia" "Lebanon" "Lesotho" "Liberia" "Libyan Arab Jamahiriya" "Liechtenstein"
"Lithuania"
"Luxembourg" "Macao" "Macedonia, The Former Yugoslav Republic Of" "Madagascar" "Malawi"
"Malaysia"
"Maldives" "Mali" "Malta" "Marshall Islands" "Martinique" "Mauritania" "Mauritius" "Mayotte"
"Mexico"
"Micronesia, Federated States Of" "Moldova, Republic Of" "Monaco" "Mongolia" "Montserrat"
"Morocco"
"Mozambique" "Myanmar" "Namibia" "Nauru" "Nepal" "Netherlands" "Netherlands Antilles" "New
Caledonia"
"New Zealand" "Nicaragua" "Niger" "Nigeria" "Niue" "Norfolk Island" "Northern Mariana Islands"
"Norway" "Oman" "Pakistan" "Palau" "Palestinian Territory, Occupied" "Panama" "Papua New
Guinea"
"Paraguay" "Peru" "Philippines" "Pitcairn" "Poland" "Portugal" "Puerto Rico" "Qatar" "Reunion"
"Romania" "Russian Federation" "Rwanda" "Saint Helena" "Saint Kitts And Nevis" "Saint Lucia"
"Saint Pierre And Miquelon" "Saint Vincent And The Grenadines" "Samoa" "San Marino" "Sao Tome
And Principe" "Saudi Arabia" "Senegal" "Serbia And Montenegro" "Seychelles" "Sierra Leone"
"Singapore" "Slovakia" "Slovenia" "Solomon Islands" "Somalia" "South Africa" "South Georgia And
The South Sandwich Islands" "Spain" "Sri Lanka" "Sudan" "Suriname" "Svalbard And Jan Mayen"
"Swaziland" "Sweden" "Switzerland" "Syrian Arab Republic" "Taiwan, Province Of China"
"Tajikistan" "Tanzania, United Republic Of" "Thailand" "Timor-Leste" "Togo" "Tokelau" "Tonga"
"Trinidad And Tobago" "Tunisia" "Turkey" "Turkmenistan" "Turks And Caicos Islands" "Tuvalu"
"Uganda" "Ukraine" "United Arab Emirates" "United Kingdom" "United States" "United States Minor
Outlying Islands" "Uruguay" "Uzbekistan" "Vanuatu" "Venezuela" "Viet Nam" "Virgin Islands,
British" "Virgin Islands, U.S." "Wallis And Futuna" "Western Sahara" "Yemen" "Zambia"
"Zimbabwe"]
</td></tr>
</table>
<font color="#000000" face="verdana" size="5">Brief Project Description</font>
[textarea* requirement 20x20 id:textarea1 class:wpcf7-form]
[submit class:wpcf7-submit "SUBMIT INQUIRY"]</a>
<img src="http://highercodetechnolabs.com/hct/1401538223_MB__LOCK.png" height="42" width="42"
align="middle"><font color="#000000" size="4"> <b>WE GUARANTEE 100% SECURITY OF YOUR
INFORMATION</font></b>
<font color="#000000" size="2">We will not share the details you provide above with anyone. Your
email won't be used for spamming.
请帮帮我@ info@highercodetechnolabs.com
答案 0 :(得分：0)
解决方案1：绝对定位黑客
您可以在输入字段之前加载自定义字体，然后将其强制向右，然后使用填充将内部文本正确放置在内部。
在Treehouse上看到这个答案https://teamtreehouse.com/forum/how-do-i-put-icons-inside-of-input-fields，它可能会为您提供一些适合您问题的解决方案的好线索。
http://jsbin.com/xexuwi/1/edit是一个有效的例子！
解决方案2：替换为背景图片
您正在使用一些自定义字体来尝试获取图标，但如果它不适合您，可能会尝试将图标设置为背景图片。
有关工作示例，请参阅我的http://jsbin.com/gakaye/3/edit解决方案。
我将图标图像分割，上传，然后将其设置为具有特定定位的背景图像。您可以将其设置为您需要的任何元素（为不同的字段设置不同的背景）。