zoukankan      html  css  js  c++  java
  • 导航,头部,CSS基础

    1. 制作自己的导航条。
    2. HTML头部元素:
      1. <base>  定义了页面链接标签的默认链接地址
      2. <style>  定义了HTML文档的样式
      3. <link>  定义了一个文档和外部资源之间的关系
    3. 练习样式表:
      1. 行内样式表
      2. 内嵌样式表
      3. 外部样式表
    4. 分别练习定义三类选择器:
      1. HTML 选择器
      2. CLASS 类选择器
      3. ID 选择器
        <!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>广州商学院</title>
        <nav>
            <img src="http://www.iconpng.com/png/webdev-seo/home19.png" width="50"height="30">
            <a href="http://www.gzcc.cn/">首页</a>
            <input type="text">
            <button>zearch</button>
        </nav>
           <link rel="stylesheet" type="text/css" href="test2.css">
        </head>
        <body>
        <h1 class="zao">广州商学院</h1>
        <h2 >2015</h2>
        <h3><span id="commentcount" >欢迎</span>boom</h3>
        
        <div id="2015"style=" 400px">
            <div id="header"style="background-color: #FFA500":><h2 align="center "style="margin-bottom: 0">登录</h2></div>
            <div id="content"style="background-color: #EEEEEE;height:150px; 400px;float: left">
                <from action="">
                    Username:<input type="text"name="user"placeholder="用户名"><br>
                    Passward:<input type="password"name="password"><br>
                    <input type="radio"name="role"value="stu">student
                    <input type="radio"name="role"value="tea">teacher<br>
        
                    <input type="checkbox"value="true"><span>记住我</span><a href="">登录遇到的问题</a><br>
        
                    <input type="button"value="login"onclick="alert('登录验证')">
                </from>
            </div>
        <div id="footer"style="background-color: #FFA500 "><i>版权@CNY</i></div>
        </div>
        <hr>
        <div>
                <ul>
                <li>python</li>
                <li>html</li>
            </ul>
            <select>
                <option>收藏</option>
                <option>点赞</option>
                <option>评论</option>
            </select>
            <hr><br>
            <h3 id="学院介绍">学院介绍</h3>
            <d1>
                <dt><a href="http://site.gzcc.cn/">信息技术与工程学院</a> </dt>
                    <dd><a href="http://site.gzcc.cn/html/xsgz/jsjxtw/">学院团学</a> </dd>
                <dt><a href="http://sfl.gzcc.cn/">外国语学院</a></dt>
                    <dd><a href="http://sfl.gzcc.cn/html/xsyd/txfc/">学院团学</a> </dd>
            </d1>
            <hr><br>
        
        </div>
        
        
         <a href="http://www.gzcc.cn/" >友情链接:广州商学院官网</a>
        
        </body>
        </html>
             <style>
        h1{ color:fuchsia; } .zao{ color: blueviolet; } #commentcount{ color: aquamarine; }
        </style>
  • 相关阅读:
    Max Sum Plus Plus HDU
    Monkey and Banana HDU
    Ignatius and the Princess IV HDU
    Extended Traffic LightOJ
    Tram POJ
    Common Subsequence HDU
    最大连续子序列 HDU
    Max Sum HDU
    畅通工程再续
    River Hopscotch POJ
  • 原文地址:https://www.cnblogs.com/YyYyYy11/p/7688590.html
Copyright © 2011-2022 走看看