zoukankan      html  css  js  c++  java
  • 大二下学期学习进度(六)

    编码时间:约16小时

    编码行数:600行

    发表博客篇数:1篇

    所学知识点:

    本周重点学习了一些CSS样式表,来美化自己的网页。

    最重要的是通过web课学会了做TAB页,通过JavaScript语言来动态的制作网页

    <script type="text/jscript">
        //显示tab(tabHeadId:tab头中当前的超链接;tabContentId要显示的层ID)
        function showTab(tabHeadId, tabContentId) {
            //tab层
            var tabDiv = document.getElementById("tabDiv");
            //将tab层中所有的内容层设为不可见
            //遍历tab层下的所有子节点
            var taContents = tabDiv.childNodes;
            for (i = 0; i < taContents.length; i++) {
                //将所有内容层都设为不可见
                if (taContents[i].id != null && taContents[i].id != 'tabsHead') {
                    taContents[i].style.display = 'none';
                }
            }
            //将要显示的层设为可见
            document.getElementById(tabContentId).style.display = 'block';
            //遍历tab头中所有的超链接
            var tabHeads = document.getElementById('tabsHead').getElementsByTagName('a');
            for (i = 0; i < tabHeads.length; i++) {
                //将超链接的样式设为未选的tab头样式
                tabHeads[i].className = 'tabs';
            }
            //将当前超链接的样式设为已选tab头样式
            document.getElementById(tabHeadId).className = 'curtab';
            document.getElementById(tabHeadId).blur();
        }
    </script>

    &copy 文字来源,参考文献的标签

    <div style="text-align: center; 100%; font-size: 12px; color: #333;">&copy;文字来源:百度百科</div>

    一些简单的CSS样式表中的文本属性

     font(缩写形式)
    font-weight(粗细)
    font-size(大小)
    font-family(字体) 
    line-height (行高)
    text-align (对齐)
    letter-spacing (字符间距)
    text-decoration (文本修饰 )
    white-space (空白处理 )

    超链接样式的四种状态
    未访问状态(a:link )
    已访问状态(a:visited )
    鼠标移上状态(a:hover )
    激活选定状态(a:active )

  • 相关阅读:
    Java中List集合去除重复数据的方法
    ActiveMQ消息中间件Producer和Consumer
    JMS Activemq实战例子demo
    利用正则表达式判断输入内容是否全中文
    纯js的右下角弹窗
    java开源项目
    linux部署jdk-tomcat
    你的主机中的软件中止了一个已建立的连接。
    Centos编译安装 LAMP (apache-2.4.7 + mysql-5.5.35 + php 5.5.8)+ Redis
    在LAMP的生产环境内添加PHP的cURL扩展模块
  • 原文地址:https://www.cnblogs.com/zjl-0217/p/10752564.html
Copyright © 2011-2022 走看看