PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > HTML+CSS > 正文

    CSS+Js在段落文字最后自动加入隐藏文字

    作者:admin来源:网络浏览:时间:2020-09-30 00:07:50我要评论
    导读:CSS和JavaScript控制段落最后自动添加指定的隐藏文字,不建议这样用,因为对搜索引擎不太友好。不过作为一项技巧来研究,下面帖出具体的代...
    CSS和JavaScript控制段落最后自动添加指定的隐藏文字,不建议这样用,因为对搜索引擎不太友好。不过作为一项技巧来研究,下面帖出具体的代码,以供参考指正:
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    2. <html xmlns="http://www.w3.org/1999/xhtml"> 
    3. <head> 
    4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    5. <title>自动加入隐藏文字</title> 
    6. <style> 
    7. .test {color:#fff;margin-left:18px;}  
    8. </style> 
    9. </head> 
    10. <body> 
    11. <p>在文章各个段落的最后加入带连接的隐藏文字</p> 
    12. <p>在文章各个段落的最后加入带连接的隐藏文字</p> 
    13. <script> 
    14. function test()  
    15. {  
    16. var myP = document.getElementsByTagName("p");  
    17. for(var i=0;i<myP.length;i )  
    18. {  
    19. var createLink = document.createElement("a");  
    20. createLink.setAttribute("class","test");  
    21. createLink.setAttribute("href","http://www.baidu.com/");  
    22. createLink.setAttribute("target","new");  
    23. var createText = document.createTextNode("百度一下");  
    24. createLink.appendChild(createText);  
    25. myP[i].appendChild(createLink);  
    26. }  
    27. }  
    28. window.onload = function() {test();}  
    29. </script> 
    30. </body> 
    31. </html> 

    这里忘了一个很重要的内容需要说明:并不是所有的overflow属性效果都一样,比如visible属性就只能对IE起作用。这样的话就有一个问题啦,如果要有高度,而且内容超出高度的时候,定义auto或hidden都可能会有一些不想要的效果出现。在这里提供一个解决方案:对于IE6及以下版本的IE,可以直接定义高度;对于IE8、火狐、Opera、Chrome可定义min-height。方法如下:
     

    1. overflow{  
    2. height:auto;  
    3. _height:200px;  
    4. min-height:200px;  
    5. verflow:auto;  
    6. zoom:1;  
    7. _overflow:visible;  

     

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-70-1507-1.html
    相关热词搜索: