工作室主页更新日志


惯用web代码预设:

自我感觉良好

(图片可能出不来,请自行测试)

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang=""> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="images/logo.jpg" rel="shortcut icon">
<title>Code&Clip Studio</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">

<link rel="stylesheet" href="css/bootstrap.min.css">

<!--Fonts-->
<link href='css/css1.css' rel='stylesheet' type='text/css'>

<!--owl-carousel css-->
<link rel="stylesheet" href="css/owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="css/owl-carousel/owl.theme.css">
<link rel="stylesheet" href="css/owl-carousel/owl.transitions.css">
<!--        <link rel="stylesheet"  href="css/animations.css">-->
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/color1.css">
<script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
</head>
<body id="page-top" class="index">

重点

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="images/logo.jpg" rel="shortcut icon">
<title>Code&Clip Studio</title>

这里

meta charset="utf-8"

必要之一,UTF- 8 是国际编码,如果你是在中国境内的话 最好就是用gb2312,会快些,且不容易出乱码。

meta http-equiv="X-UA-Compatible"content="IE=edge"

为了避免制作出的页面在IE8下面出现错误,建议直接将IE8使用IE7进行渲染。也就是直接在页面的header的meta标签中加入这个,这样我们才能使得页面在IE8里面表现正常!浏览器市场份额的激烈竞争,给网页设计开发人员带来了兼容性设计的麻烦。仅IE浏览器就有好几个主流版本,IE6、IE7、IE8 等等。当然使用诸如 IETester,多版本 IE 共存解决方案之类的第三方集成工具,可以方便代码调试。但我们总需要找寻一种更为省时省力的方法。 X-UA-Compatible 是针对 IE8 版本的一个特殊文件头标记,用于为 IE8 指定不同的页面渲染模式。由于当下 IE6 和 IE7 使用率依然较高,综合考虑,启用 IE8 版本的 X-UA-Compatible 兼容模式显得相当重要。

link href="images/logo.jpg" rel="shortcut icon"

加入网页logo

title Code&Clip Studio /title

网页名称

导航栏

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav text-center">
                    <li><a href="index.html">Code&Clip Studio</a></li>
                    <li><a href="aboutus.html">关于我们</a></li>
                    <li><a href="services.html">我们的项目</a></li>
                    <li class="logo-holder">                        
                        <a href="index.html"><img src="images/logos/logo-c1.png" alt=""></a>
                    </li>
                    <li><a href="contact.html">加入我们</a></li>
                    <li><a href="h/index.html">鹤麇社</a></li>
                    <li><a href="https://i.daybreak.cc/">博客</a></li>
                    <li><a href="ssyq.html">小圆一下</a></li>
                </ul>
            </div>

这是一个最简单的标签样式的导航,li标签中的active则是当前页的状态胶囊式的标签页则只需把.nav navbar-nav text-center类换成.nav-pills类即可,如下图类似:(图片可能出不来,请自行测试)

    当然,胶囊是标签页也是可以垂直方向堆叠排列的。只需添加 .nav-stacked 类,如下图类似: (图片可能出不来,请自行测试)