• 《PHP求职宝典》Web设计页面笔记


      偶然间在图书馆看见这本书,名字很吸引人,果然不错,许多细节以前没在意,但是确实值得注意一下。先分享一下Web设计页面的内容。可能对比较独到的程序员来说比较弱智,不过只针对可以对那些有帮助的程序猿而言分享一下学习的经验:

    通过form表单控制上传文件的大小:

    enctype="multipart/form-data",指定表单编码数据方式
    ethod="",指定数据传输方式
    <input type="hidden" name="MAX_FILE_SIZE" value="1000" />,通过隐藏域控制上传文件的大小(字节),不能超过php.ini中upload_max_filesize选项设置的值。

    当鼠标划过文本框,自动选中文本框中的内容:

    <input type="text" value="" onmouseover="this.select()" />
    

      

    解决ff浏览器中嵌套div标签text-alian属性失效的问题:

    将里面嵌套的div设置style:margin:0px auto;

    使一个div层居中定位:

    position:absolute;top:50px;left:50px;margin:-100px 0 0 -100px;

    <span>和<div>标签的区别:

    span标记属于内联的,一般用于小规模的样式内联到HTML文档中,div元素本身就是块级元素,多用于组合大块的代码。

    定义1px左右高度的容器:

    overflow:hidden | zoom:0.08 | line-height:1px;

    解决ff下文本无法撑开容器的高度:

    1. 设置min-width和min-height

    2. 加入一个清除对齐方式的类clear:both属性来自动计算火狐浏览器的高度。

    解决超链接被点击后hover样式不会出现的问题:

    对超链接样式属性进行正确的排序:

    link--visited--hover--action

    解决IE6下双倍编剧问题:

    display:inline

    jQuery:

    jQuery是一个优秀的JavaScript库,是一个由John Resig创建于2006年1月的开源项目。团队中有三个核心人物:John Resig、Brandon Aaron和Jornada Zaeffere,宗旨:WRITE LESS,DO MORE。

    制作一个照片轮换效果:

     <html>    
    <head>    
        <script src="jquery.js"></script>    
        <style>    
            ul{list-style:none;500px;border:1px solid red;}    
            ul li{position:absolute}    
            ul li img{350px;height:300px}    
        </style>    
    </head>    
    <body>    
        <div class="change">    
        <ul>    
            <li><img src="1.jpg"></li>    
            <li><img src="2.jpg"></li>    
            <li><img src="3.jpg"></li>    
            <li><img src="4.jpg"></li>    
        </ul>    
        </div>    
        <script>    
            $(function(){    
                $(".change ul li:not(:first)").hide();    
                setInterval(function(){    
                    if($(".change ul li:last").is(":visible")){    
                        $(".change ul li:first").fadeIn('slow');    
                        $(".change ul li:last").hide();    
                    }else    
                        $(".change ul li:visible").next().fadeIn('slow');    
                },1000);    
            });    
        </script>    
    </body>    
    </html>
    

      

     

      

    使用jquery获取当前DOM元素的左上角在整个文档的位置:

      $(function(){    
        var width = $("ul").css("margin-left");    
        var height = $("ul").css("margin-top");    
        alert(width+","+height);    
    });
    

      

    在DOM树中替换指定元素:

     <script>    
          var title=$('<span>dd</span>');    
          $("div").replaceWith(title);    
    </script>
    

      

    在DOM树中创建并插入元素:

        <script>    
        var title = $('<span>adf</span>');    
        $("div").append(title); //将title追加到div标签内容后面    
        $("div").before(title); //将title追加到div标签之前与div标签属于同一层次    
        $("div").prepend(title);    //将title追加到div标签内容之前    
        $("div").after(title);  //将title追加到div标签之后与div标签属于同一层次    
    </script>

  • 相关阅读:
    SpringMVC使用静态资源
    MyBatis学习系列三——结合Spring
    新生儿操作系统操作手册
    新生儿信息管理系统升级说明
    Installing Vim 8.0 on Ubuntu 16.04 and Linux Mint 18
    git push.default 几种设置笔记
    vue测试安装和配置
    rspec 笔记
    vue引入bootstrap和fontawesome
    Vue单文件模板实例
  • 原文地址:https://www.cnblogs.com/fanchangfa/p/2786184.html
Copyright © 2020-2023  润新知