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

最新推荐文章于 2024-04-26 10:29:34 发布

fchangfa

最新推荐文章于 2024-04-26 10:29:34 发布

阅读量463

点赞数

分类专栏： PHP

本文链接：https://blog.csdn.net/fchangfa/article/details/8943634

版权

PHP 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

　　偶然间在图书馆看见这本书，名字很吸引人，果然不错，许多细节以前没在意，但是确实值得注意一下。先分享一下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="" οnmοuseοver="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;width:500px;border:1px solid red;}    
        ul li{position:absolute}    
        ul li img{width: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>

fchangfa

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
《PHP求职宝典》--Web设计页面笔记

偶然间在图书馆看见这本书，名字很吸引人，果然不错，许多细节以前没在意，但是确实值得注意一下。先分享一下Web设计页面的内容。可能对比较独到的程序员来说比较弱智，不过只针对可以对那些有帮助的程序猿而言分享一下学习的经验：通过form表单控制上传文件的大小： enctype="multipart/form-data",指定表单编码数据方式 ethod
复制链接

扫一扫