CSS3 submission input box style_html/css_WEB-ITnose-HTML Tutorial-php.cn

Home

Web Front-end

HTML Tutorial

CSS3 submission input box style_html/css_WEB-ITnose

Jun 24, 2016 am 11:55 AM

Made an input box style, as shown in the picture:

The CSS code is as follows:

#button {    cursor:pointer;    width:30%;    margin:5px;    padding:8px;    border-radius:4px 4px 4px 4px;    font-size:14px;    font-weight:bold;}input{	transition:all 0.30s ease-in-out;	-webkit-transition: all 0.30s ease-in-out;	-moz-transition: all 0.30s ease-in-out;		border:#364f86 1px solid;	border-radius:3px;	outline:none;}input:focus{	box-shadow:0 0 5px rgba(81, 203, 238, 1);	-webkit-box-shadow:0 0 5px rgba(81, 203, 238, 1);	-moz-box-shadow:0 0 5px rgba(81, 203, 238, 1);}textarea{	transition:all 0.30s ease-in-out;	-webkit-transition: all 0.30s ease-in-out;	-moz-transition: all 0.30s ease-in-out;		border:#364f86 1px solid;	border-radius:3px;	outline:none;}textarea:focus{	box-shadow:0 0 5px rgba(81, 203, 238, 1);	-webkit-box-shadow:0 0 5px rgba(81, 203, 238, 1);	-moz-box-shadow:0 0 5px rgba(81, 203, 238, 1);}

Copy after login

The table code is as follows:

&lt;table&gt;                               &lt;tr&gt;                    &lt;td&gt;用户名&lt;/td&gt;                    &lt;td&gt;&lt;input name=&quot;username&quot; type=&quot;text&quot; id=&quot;username&quot; placeholder=&quot;用户名&quot;  style=&quot;height:25px&quot;&gt;&lt;/input&gt;*&lt;/td&gt;                &lt;/tr&gt;                                              &lt;tr&gt;                    &lt;td&gt;联系方式&lt;/td&gt;                    &lt;td&gt;&lt;input name=&quot;contact&quot; type=&quot;text&quot; id=&quot;contact&quot; placeholder=&quot;电话或邮件地址&quot;  style=&quot;height:25px&quot;&gt;&lt;/input&gt;*&lt;/td&gt;                &lt;/tr&gt;                &lt;tr&gt;                    &lt;td&gt;意见及建议&lt;/td&gt;                    &lt;td&gt;&lt;textarea name=&quot;comment&quot; id=&quot;comment&quot; rows=&quot;9&quot; cols=&quot;112&quot; &gt;&lt;/textarea&gt;&lt;/td&gt;                &lt;/tr&gt;               			    			    &lt;tr&gt;				&lt;td colspan=&quot;2&quot;align=&quot;center&quot;&gt;&lt;input type=&quot;submit&quot; id=&quot;button&quot; value=&quot;提交&quot; /&gt;&lt;/td&gt;			    &lt;/tr&gt;&lt;/table&gt;

Copy after login

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn