редактировать контактную форму 7 место

Я использую плагин contact form7 для WordPress на моем сайте для всех форм.

Ссылка формы

  1. http://highercodetechnolabs.com/contact-us/

Теперь я хочу добавить какой-нибудь значок шрифта в поле формы, например, более высокий codetechnolabs 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">&nbsp;<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.

Пожалуйста, помогите мне @ [email protected]

0

Решение

Решение 1: взломать абсолютное позиционирование

Вы можете загрузить собственный шрифт непосредственно перед полем ввода, а затем принудительно направить его вправо, а затем просто правильно разместить текст-заполнитель внутри, используя отступы.

Смотрите этот ответ https://teamtreehouse.com/forum/how-do-i-put-icons-inside-of-input-fields на Treehouse, это может дать вам хорошие подсказки для решения, которое подходит для вашей проблемы.

http://jsbin.com/xexuwi/1/edit за рабочий пример!

Решение 2: заменить фоновыми изображениями

Вы используете некоторые пользовательские шрифты, чтобы попытаться ввести значки, но если это не работает для вас, возможно, вместо этого попробуйте установить значки в качестве фоновых изображений.

См мой http://jsbin.com/gakaye/3/edit Решение для рабочего примера.

Я вырезал изображение значка, загрузил его, а затем установил как фоновое изображение с определенным расположением. Вы можете установить его на любой элемент, который вам нужен (чтобы иметь разные фоны для разных полей).

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]