Style trigger effect of web page input box
|
<br />This example mainly studies two parameters, onblur and onFocus. Because these two parameters were rarely encountered before, Baidu immediately understood that onblur is an event triggered when the control loses focus, and onFocus is an event triggered when it becomes the input focus. These two parameters can be combined with className to directly call the style sheet class name. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title></title> </head> <body> <style type="text/css"> .input1{ font-family: verdana;background-color: #EEEEEE;border-bottom: #FFFFFF 1px solid;border-left: #CCCCCC 1px solid;border-right: #FFFFFF 1px solid;border-top: #CCCCCC 1px solid;font-size: 12px; } .input1-bor { font-family:verdana;background-color:#F0F8FF;font-size: 12px; border: 1px solid #333333;} </style> <table cellspacing=2 cellpadding=0 width=300 border=0> <tr> <td><font class="en1">Name:</font> </td> <td><input size=40 name=name class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"> </td> </tr> <tr> <td><font class="en1">Email:</font></td> <td><input size=40 name=email class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"></td> </tr> <tr> <td><font class="en1">Website:</font> </td> <td><input size=40 name=url class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"> </td> </tr> <tr> <td><font class="en1">Topic:</font> </td> <td><input size=40 name=subject class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"> </td> </tr> <tr> <td><font class="en1">Content: </font> </td> <td><textarea name=message rows=5 cols=35 class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"></textarea></td></tr></table> </body> </html> |
<<: Docker and Docker-compose one-click installation tutorial (supports online and offline)
>>: Solution to navicat automatically disconnecting from the database after a period of time
Recommend
Detailed explanation of Bind mounts for Docker data storage
Before reading this article, I hope you have a pr...
How to set the height of the autosize textarea in Element UI
After setting textarea input in Element UI to aut...
MySQL transaction details
Table of contents Introduction Four characteristi...
Implementation of the list-style-type attribute in front of CSS ordered or unordered lists
example: <html> <head> <style type...
The space is displayed differently in IE, Firefox, and Chrome browsers
The display effects on IE, Fir...
Parsing Linux source code epoll
Table of contents 1. Introduction 2. Simple epoll...
Linux operation and maintenance basic process management real-time monitoring and control
Table of contents 1. Background running jobs 2. U...
Ubuntu 15.04 opens mysql remote port 3306
Ubuntu 15.04 opens MySQL remote port 3306. All th...
Detailed explanation of redo log and undo log in MySQL
The most important logs in the MySQL log system a...
css3 flex layout justify-content:space-between the last line is aligned to the left
When using justify-content:space-between layout, ...
CentOS 7 set grub password and single user login example code
There are significant differences between centos7...
Problem record of using vue+echarts chart
Preface echarts is my most commonly used charting...
Kali Linux installation VMware tools installation process and VM installation vmtools button gray
Xiaobai records the installation of vmtools: 1. S...
Draw a heart with CSS3
Achieve resultsRequirements/Functionality: How to...
Three ways to implement virtual hosts under Linux7
1. Same IP address, different port numbers Virtua...