Maison >interface Web >tutoriel HTML >基于CSS+dIV的网页层，点击后隐藏或显示_html/css_WEB-ITnose
基于CSS+dIV的网页层，点击后隐藏或显示_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 11:38:211375parcourir
一个基于CSS+dIV的网页层，用JavaScript结合Input按钮进行控制，点击后显示或隐藏，网页上常用到的特效之一，实用性较强，相信对大家的前端设计有帮助。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>层隐藏，层点开</title></head><body><div id="box" style="border:1px solid #000; height:300px; width:300px;" ><a href='http://www.100sucai.com' target='_blank'>http://www.100sucai.com</a></div><input name="" type="button" value="点击隐藏" id="btn" onclick="btn()" style="position:absolute; left:320px; top:10px;"></body><script type="text/javascript">var btn1=document.getElementById('btn');var box1=document.getElementById('box');function btn(){ if(btn1.value=="点击隐藏"){box1.style.display='none';btn1.value="点击显示";}else{box1.style.display='';btn1.value="点击隐藏";}}</script></html>
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：css脱离文档流_html/css_WEB-ITnoseArticle suivant：Html做三个平台原生APP啦_html/css_WEB-ITnose