How to change mouseover style without using CSS-CSS Tutorial-php.cn

We know that in web page layout, there are some special cases where we cannot directly use external CSS styles to control DIV styles, such as setting a:hover to A, so how can we change it without applying CSS styles? What about mouseover styles?

You can useonMouseOver(mouse moves over the target) andonMouseOut(after the mouse moves away from the target) to achieve the a tag or otherhtml tagsSet hover style.

You can use it directly on tags, regardless of A tag, SPAN tag, DIV tag, etc.

text-decoration:none"

onMouseOver ="this.style.color='#F00';this.style.textDecoration='underline'"

onMouseOut="this.style.color='#00F';this.style.textDecoration=' none'">DIV

The above sets the default style for the ahyperlinkcode, the style after the mouse moves to the target and the mouse moves away from the target. The feature code is relatively long.

Important Note: In order to see the same default style after the mouse is moved away, you usually need to use style directly on the label to set the default CSS style and keep it the same as the onMouseOut setting CSS style. In order to avoid the difference between the initial state object style and the style after the mouse moves away from the object.

The above code:

style="color:#00F; text-decoration:none" 与 onMouseOut="this.style.color='#00F';this.style.textDecoration='none'"

Copy after login

Set the default font color #00F and not display underlines.

The examples of hover style setting methods through regular hover and without external hover are as follows

Complete regular external CSS case display code:

    实例  
   欢迎访问PHP网站！ 
  默认我是蓝色，鼠标悬停时变红色并加粗。

Copy after login

HTML code and browser effect screenshot illustration

DIV CSS default and mouse-over browser test effect screenshots

Default and mouse-over browser test effect screenshots

HTML source code after external CSS style conversion

    DIVCSS5实例 
   欢迎访问 DIVCSS5网站！ 
  默认我是蓝色，鼠标悬停时变红色并加粗。

Copy after login

I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!