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

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>MIS问答平台</title>
        <base href="http:www.gzcc.cn/"target="_blank">
        <link rel="stylesheet"type="text/css"href="171.css">
        <style type="text/css">
         p{
        color:yellow
        }
        p1{
        color:blue
        }
    </style>
    </head>
    <body>
    <nav>
            <a href="">官方首页</a>
         <a href="">校内咨询</a>
            <a href="http://www.gzcc.cn/">下载APP</a>
            <input type="text"name="search">
            <button type="submit">搜索</button>
        <a href="">返回</a>
        <a href="">注销</a>
        </nav>
    <hr>
         行内样式
    <div style="100px;height:100px;background:red;"></div>
    内嵌样式
    <style type="text/css">
    #div{width:100px;height:100px;background:red;}
    </style>
    <div id="div"></div>
         外部样式
    <div id="div"></div>
         <hr>
    <div>
           <p> 通知:请自行保护好自己的帐号密码,防止信息泄露!</p>
            <P>警告:请自行保护好自己的帐号密码,防止信息泄露!</P>
            <p>注意:请自行保护好自己的帐号密码,防止信息泄露!</p>
    
        </div>
    <hr>
    <h1>MIS问答平台</h1>
    
    <div id="container1" style="400px" >
        <div id="head" ><h2 align="center" style="margin-bottom:0;">登陆</h2></div>
        <div id="content1" style="backgroud-color:#ff5412;height:150px;400px;float:left;">
             <form>
                用户名:<input type="text" name="用户名" style="backgroud-color:black" placeholder="请输入用户名" ><br>
                密码:<input type="text" name="密码"placeholder="请输入密码"><br>
                <input type="radio">学生
                <input type="radio">老师<br>
                <input type="submit" name="Button1" value="登陆" id="Button1" class="btn_dl">
                <input type="submit" name="Button2" value="取消" id="Button2" class="btn_qx">
            </form>
    
    
    
          </div>
    
        <div id="footer" style="background-color:cyan;clear:both;text-align:center;">版权  ben</div>
    
    </div>
    <div  id="container" style="400px " >
        <div id="header" style="background-color:deepskyblue"><h2 align="center" style="margin-bottom:0;">相关栏目/Related sections</h2>
        </div>
    
        <div id="content" style="background-color:lightskyblue;height:150px;400px;float:left;">
                    <form>
                        <select>
                        <option>问答</option>
                        <option>选择</option>
                        <option>收藏</option>
                        </select>
    </form>
    
    <ul>
        <li>日常监控</li>
        <li>课表管理</li>
        <li>学籍管理</li>
        <li>教材管理</li>
        <li>教学简报</li>
    </ul>
             </div>
        <div id="footer" style="background-color:deepskyblue;clear:both;text-align:center;">版权  ben</div>
    
    </div>
    <div  id="container" style="400px " >
        <div id="header" style="background-color:hotpink"><h2 align="center" style="margin-bottom:0;">快速通道 Fast Track</h2>
        </div>
    
        <div id="content" style="background-color:lightskyblue;height:150px;400px;float:left;">
        <ol>
        <li>校历</li>
        <li>专业课表</li>
        <li>教务系统</li>
    </ol>
     <dl>
                      <dt>学院</dt>
                          <dd>会计学院</dd>
         <dd>信息学院</dd>
         </dl>
             </div>
        <div id="footer" style="background-color:hotpink;clear:both;text-align:center;">版权  ben</div>
    
    </div>
    </body>
    </html>
    p{
                color:red;
            }
            .textblue{
                color:blue;
            }
            tea{
                background-color:#FFD700;
            }
            div{100px;
                height:100px;
                background:black;
            }



  • 相关阅读:
    Python IDE
    python 3.x 不再提供raw_print()
    Python代码风格建议(转)
    在JSP页面中输出JSON格式数据
    MyEclipse 10 优化
    MB/GB/TB/PB/EB/ZB/YB/NB/DB/CB存储空间都是多大?如何换算?
    为什么民众不以偷税为耻_岑科
    彻底解剖人民币升值问题_岑科
    script 加载顺序问题的延展研究
    如何快速实现 markdown 转 HTML 文档?
  • 原文地址:https://www.cnblogs.com/0055sun/p/7683256.html
Copyright © 2011-2022 走看看