官网制作

1.禁止缓存

a.设置头部meta似乎没什么效果,但是有必要写出来

    <METAHTTP-EQUIV="Pragma" CONTENT="no-cache">
    <METAHTTP-EQUIV="Cache-Control" CONTENT="no-cache">
    <METAHTTP-EQUIV="Expires" CONTENT="0">

b.js添加随机数

   var vs = Math.random();
   var linkNode1 = document.createElement("link")//, scriptNode = document.createElement("script");
   linkNode1.setAttribute("rel", "stylesheet");
   linkNode1.setAttribute("type", "text/css");
   linkNode1.setAttribute("href", "Content/Layout.css?vs=" + vs);
   document.head.appendChild(linkNode1);

2.火狐浏览器不支持embed标签,可考虑iframe,object,也可以建议用户升级浏览器

a.

<iframe height=552 width=1200 src='http://player.youku.com/embed/XMzYyNTg3NTkzNg==' frameborder=0 'allowfullscreen'></iframe>

 b.

<!--[if IE ]>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
									width="700" height="400">
   <param name="movie" value="http://player.youku.com/player.php/sid/XMzYyNTg3NTkzNg==/v.swf" />
   <param name="quality" value="high" />
   <param name="allowFullScreen" value="true" />
   <param name="FlashVars" value="vcastr_file=12.flv&LogoText=description&BufferTime=3&IsAutoPlay=1">
   <embed src="http://player.youku.com/player.php/sid/XMzYyNTg3NTkzNg==/v.swf" allowfullscreen="true" flashvars="vcastr_file=12.flv&IsAutoPlay=1&LogoUrl=images/logo.jpg" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="700" height="400"></embed>
    </object>

<![endif]-->

升级浏览器

 var app= "Microsoft Internet Explorer"
        if(navigator.appName.indexOf(app) ==0){
            alert("请将您的浏览器升级到谷歌/火狐浏览器")
        }

3.更多视频,更多案例等小三角形(纯css)

.trigon {
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-left: 10px solid #fff;
    border-bottom: 5px solid transparent;
    margin-left: 5px;
}

4.跳转到指定锚点(选项卡)

指定某个锚点a.html

<ul class="dropdown-menu">
    <li><a onclick="SelectOn('Case/Index.html#GDSLDL',this);"; href="javascript:void(0)" class="size14">广东水利电力学院</a></li>
    <li><a onclick="SelectOn('Case/Index.html#FSKX',this)" href="javascript:void(0)" class="size14">佛山科学技术学院</a></li>
    <li><a onclick="SelectOn('Case/Index.html#CASE3',this)" href="javascript:void(0)" class="size14">更多案例</a></li>
    <li><a onclick="SelectOn('Case/Index.html#VIDEO',this)" href="javascript:void(0)" class="size14">更多视频</a></li>
</ul>

b.html设置显示某个选项卡,

aria-controls为自定义属性,设置和锚点id一样

var url = location.href; //获取url
    // alert(url)
    strs = url.split("#")[1];
    if (strs != null || strs != undefined) {
   $("#casetab a").removeClass("soluulactive");
   $("#casetab a[aria-controls='" + strs + "']").addClass("soluulactive");

   $("#tab-content .tab-pane").removeClass("active");
   $("#tab-content .tab-pane[id='" + strs + "']").addClass("active");
}

5.flex是个好东西,特别对于多个元素,还想让他们垂直居中的时候;

6.自适应的话得看公司要求

有些是不够宽就自动往下排,可用bootstrap布局,但是我们公司是要求不管分辨率多少,都要保持版面一致,所以就只能缩小字体,图片大小了

/*990-1200 */
@media (max-width:1240px){
    .w1200{
        width: 960px;
}}

7.ie默认宋体,谷歌默认微软雅黑,然后某些文字就不一样了,坑,继承不下去

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值