HTML/CSS测试代码二

最新推荐文章于 2023-02-01 20:01:28 发布
最新推荐文章于 2023-02-01 20:01:28 发布
阅读量619 收藏
点赞数
分类专栏： Web前端开发 文章标签： html 测试 xhtml
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chongshangyunxiao321/article/details/51121286
版权

进一步补充基础知识，完善整个体系。学无止境！

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="MyFirstWeb.Login" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
    <title>武神赵子龙</title>
<style type="text/css">      
        .my1
        {  
            list-style-type:none  
        } 

        .li1
        {       
            float:left  
        }  

         .style28
        {
            width: 100%;
            border: 2px solid #0000FF;
         }

        .style29
        {
            width: 256px;
        }

        .style30
        {
            width: 257px;
        }

        .header1
        {   height:100px;
            background:blue;            
        }

        .header2
        {   height:100px;
            width:666px;
            background:green; 
            float:left;  
        }

        .header3
        {   height:100px;
            width:667px;
            background:red; 
            float:left;   
        }

        .header4
        {   height:100px;
            background:yellow; 
            clear:left;  
        }

        .container
        {
           width:1000px; 
           background:gray;          
        }

        .header
        {
           height:200px;
           background:orange;
           border:10px dashed purple;

        }

        .main
        {
            background:blue;

        }

        .lside
        {            
            width:700px;
            height:600px;            
            background:pink;
            float:left;     
        }

        .four
        {
            width:330px;
            height:280px;
            margin:10px;
            background:black;
            float:left;
        }

         .rside
        {         
            width:300px;
            height:600px;                     
            background:red;
            float:right;     
        }

        .font
        {                     
            background:yellow;
            height:200px;
            clear:left;            
        }

</style> 
</head>

<body background="5.jpg">
    <form id="form1" runat="server">
    <div>
            <h2>欢迎进入我的地盘!</h2>
            <br/> 

            <h1 align="center"><i>我是歌手今晚7进5战火重燃!</i></h1>

            <asp:Image ID="Image1" runat="server" Height="300px"
                 ImageUrl="~/image1/t0135a6f7b5b41e2d73.jpg" Width="500px" ImageAlign="Right" />
            <br/>  
            <br/>  
            <font size="4"><center><u>www.huanantv.com|2016-04-09|来源：深圳晚报</u></center></font>  
            <br/>  

            <p>本报讯（记者王纯）今晚20:30，“2016我是歌手”长沙唱区战火重燃，7名选手将争夺5个入围名额，湖南卫视现场直播。</p>  
            <p>导演廖珂介绍，收集了热心观众的意见后，本场比赛将对赛制做出细微调整，选手去留的决定权将重新由短信，专业评委，大众评审和选手“四方面制衡”，让比赛更具有悬念和看点。</p>  
            <p>7强晋级赛备选曲目</p>  
            <p>01号张美娜：《country road take me home》、《干杯朋友》</p>  
            <p>03号张亚飞：《onlyone》、《close to you》</p>  

            <br/>  
            <br/> 

            <h1>一个嵌套列表：</h1> 

              <ul type="disc">  
                    <li>咖啡</li>  
                    <li>茶</li>  
                        <ul type="circle">  
                            <li>红茶</li>  
                            <li>绿茶</li>  
                                <ul type="square">  
                                <li>中国茶</li>  
                                <li>非洲茶</li>  
                                </ul>  
                        </ul>  
              </ul>  
              <ul type="disc">  
                    <li>牛奶</li>  
              </ul> 


        <h3>水平导航：</h3>  

            <ul class="my1">  
                <li class="li1">首页 </li>  
                <li class="li1">- 新闻 </li>  
                <li class="li1">- 体育 </li>  
                <li class="li1">- 娱乐圈 </li>  
                <li class="li1">- 财经 </li>  
                <li class="li1">- IT </li>  
                <li class="li1">- 汽车 </li>  
                <li class="li1">- 房产 </li>  
                <li class="li1">- 家居 </li>  
                <li class="li1">- 女人 </li>  
                <li class="li1">- 短信 </li>  
                <li class="li1">- 邮件 </li>  
            </ul>


        <br/> 


        <h3>垂直导航：</h3> 

            <ul class="my1">  
                 <li>公司简介</li>  
                <li>组织机构</li>  
                <li>荣誉称号</li>  
                <li>联系我们</li>  
            </ul> 

        <br/>
        <br/>  

          <marquee behavior="scroll" direction="right" scrolldelay="0" >     
          <img src="1.jpg"  height="300" width="400">  
          <img src="2.jpg"  height="300" width="400">  
          <img src="3.jpg"  height="300" width="400">  
          </marquee>       
    </div>

            <br/>  
            <br/> 
            <br/>  

                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="确定登录" />


            <br/>  
            <br/> 
            <br/>  
    </form>

                <table class="style28">
                    <tr>           
                        <td class="style29">
                        <marquee behavior="scroll" direction="right" scrolldelay="10"> 
                            生命不息，奋斗不止
                        </marquee>     
                                </td> 
                        <td class="style30">
                            love</td>
                        <td>
                            go</td>
                        <td>
                            功</td>
                        <td>
                            绝</td>
                    </tr>
                    <tr>
                        <td class="style29">
                            决不妥协，永不放弃</td>
                        <td class="style30">
                            life</td>
                        <td>
                            go</td>
                        <td>
                            不</td>
                        <td>
                            世</td>
                    </tr>
                    <tr>
                        <td class="style29">
                            会当凌绝顶，一览众山小</td>
                        <td class="style30">
                            live</td>
                        <td>
                            go</td>
                        <td>
                            可</td>
                        <td>
                            无</td>
                    </tr>
                    <tr>
                        <td class="style29">
                            我自岿然不动</td>
                        <td class="style30">
                            alive</td>
                        <td>
                            go</td>
                        <td>
                            没</td>
                        <td>
                            双</td>
                    </tr>
                </table>


<br/>
<br/>

        <div class="header1">      </div>
        <div class="header2">      </div>
        <div class="header3">      </div>
        <div class="header4">      </div>

<br/>
<br/>

        <div class="container">

            <div class="header"> <center><h1>  绝世无双  </h1>  </center>   </div>

            <div class="main">

               <div class="lside">
                   <div class="four">   </div>
                   <div class="four">   </div>
                   <div class="four">   </div>
                   <div class="four">   </div>
               </div>

               <div class="rside"> 


               </div>

            </div>

            <div class="font">   <center><h1>  止戈为武  </h1>  </center>   </div>
        </div>

<br/>
<br/>

</body>
</html>

部分效果图如下：
这里写图片描述

这里写图片描述

参考链接：
HTML/CSS网页开发视频教程(http://edu.csdn.net/course/detail/535/6511?auto_start=1)
HTML教程：(http://w3school.com.cn/html/index.asp)
CSS教程：(http://w3school.com.cn/css/index.asp)
JavaScript教程：(http://w3school.com.cn/js/index.asp)
JQuery教程：(http://w3school.com.cn/jquery/index.asp)
SQL基础教程：(http://w3school.com.cn/sql/index.asp)
ASP.NET教程：(http://w3school.com.cn/aspnet/index.asp)
ASP.NET企业级开发基础视频：(http://edu.csdn.net/course/detail/829/11358?auto_start=1)

chongshangyunxiao321
关注
专栏目录
网页html/js/css错误代码在线检测网站汇总
计算机毕业论文源码，学生个人网页制作html源码。贴近用户做网络推广和互联网优化。
03-21 2万+
在用IE浏览网站时，发现下面显示“网页上有错误”，虽然不影响浏览，但总归让人感觉不舒服，大概多数站长都遇到过。而如果你的代码基础不是很好的话也许根 本找不到办法去解决这个问题，以致费了好多时间都无从下手，我是遭遇过多次这样的烦恼，因为本站加了一些代码，但是难免会冲突，有时候就在状态栏显示错 误，代码很长挨个看实在头疼。  于是百度一下，狂搜网页错误在线检测工具，结果还真发现了不少，把用过的工具进
html，css代码检查
weixin_34220963的博客
05-19 120
http://jigsaw.w3.org/css-validator/css代码检查空空2015/5/1916:04:48http://validator.w3.org/#validate_by_urihtml代码检查 转载于:https://www.cnblogs.com/baoliwei/p/4514793.html...
《文字与段落——使用HTML标记完成页面排版》
JiangBo_Liu 博客
11-19 1万+
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2011, 烟台大学计算机学院学生 * All rights reserved. * 文件名称：   《文字与段落——使用HTML标记完成页面排版》                           * 作    者：       刘江波                       * 完
分享css 填坑常用代码(未测试)
程序员_007的博客
07-22 836
以下是常用的代码收集，没有任何技术含量，只是填坑的积累。转载请注明出处，谢谢。 一. css 2.x code 1. 文字换行    /*强制不换行*/ white-space:nowrap; /*自动换行*/ word-wrap: break-word; word-break: normal; /*强制英文单词断行*/ word-break:break-all; 2. 两
VUE 出现Access to XMLHttpRequest at ‘http://192.168.88.228/login/Login?phone=19939306484&password=111‘
CaseyWei
02-20 6万+
报错如上图！！！！ 跨域了，设置代理就好，解决办法首先打开 config -> index.js ，粘贴 如下图代码，'https://www.baidu.com'换成要访问的的api域名，注意只要域名就够了，不是整个api地址。代码（效果图）如下 更改完以后，还需要我们把src/mains.js 中的 axios.defaults.baseURL = 'htt...
HTML/CSS测试代码一
明镜止水的博客
04-10 1144
学完以下这些模块，基本上已经熟悉HTML、CSS啦，只要多加练习，就能孰能生巧，学完这个就可以真正去学ASP.NET网站设计啦，加油！
网页制作基础学习——HTML+CSS常用代码
最新发布
北辰的博客
02-01 4万+
HTML（HyperText Markup Language）,即超文本标记语言，是用于描述网页文档的一种描述标记语言。是标准通用标记语言下的一个应用，也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。
HTML/CSS代码快速生成
得已
03-16 3万+
一、快速编写HTML代码            输入后按tab键1.  初始化 HTML文档需要包含一些固定的标签，比如&lt;html&gt;、&lt;head&gt;、&lt;body&gt;等，现在你只需要1秒钟就可以输入这些标签。比如输入“!”或“html:5”，然后按Tab键： 输入html:xt，然后按Tab键：html:4s：用于HTML4严格文档类型2.  轻松添加类、id、文本和...
HTML/CSS/Javascript在线代码运行工具 v1.0
10-06
总的来说，HTML/CSS/Javascript在线代码运行工具v1.0是一个强大且实用的开发辅助平台，它简化了前端开发过程，提升了效率，无论是初学者学习基础知识，还是专业人士测试代码片段，都能从中受益。通过这个工具，我们...
HTML/CSS/Javascript在线代码运行工具源代码
03-18
HTML/CSS/Javascript在线代码运行工具是Web开发者和学习者常用的一种实用资源，它允许用户在浏览器环境中直接编写、测试和运行这三种语言的代码片段，而无需在本地安装任何额外的软件。这个源代码提供了这样一个平台...
CSS样式测试
Monkey-yc
10-13 1683
1.CSS概述 CSS：指层叠样式表（Cascading Style Sheets） 作用：可以为网页创建样式表，渲染网页。写成样式文件是为了代码的复用。 构成：选择器，以及一条或多条声明。 2.选择器 2.1元素选择器 元素选择器是最常见的元素选择器。又被称为类型选择器。类型选择器会匹配文档中该元素类型的所有实例。 div { text-align: center; } ...
Inherits Codebehind Src 在<%@Page的属性
Haibing的博客
08-30 549
<br /> <br /> <%@   Page   language="c#"   Codebehind="WebForm1.aspx.cs"   AutoEventWireup="false"   Inherits="WebApplication1.WebForm1"   %>   <br />    <br />  其中有三个属性（Inherits、Src、CodeBehind）非常容易混淆，下面分别给予说明，说不定对这位朋友会有些帮助。   <br />    <br />  Inherits  
C#学习之web网站制作入门篇（ASP.NET）
热门推荐
明镜止水的博客
04-09 6万+
之前熟悉C#与.net, 以为.net就是C#，现在知道了.NET是C#的开发平台，C#即可用来开发客户端（WindowsFrom），也可以用来开发网站即ASP.NET;
JQuery MiniUI学习笔记一
明镜止水的博客
05-09 4775
JQuery MiniUI来自开源中国的开源项目，由上海普加软件有限公司版权所有： 学习这个，对于如何设计表格、树形目录，数据库的增删改减以及UI设计的学习很有帮助。
jQuery学习进阶篇
明镜止水的博客
04-14 3395
JQuery选择器 学习JQuery选择器是如何准确地选取你所希望应用效果的元素。JQuery元素选择器和属性选择器允许你通过标签名、属性名或内容对HTML元素进行选择。选择器允许你对HTML元素或单个元素进行操作。jQuery 选择器参考表 JQuery事件方法jQuery 是为事件处理特别设计的。 jQuery 事件函数 1、JQuery 事件处理方法是 jQ
网页设计（div css）之浏览器不兼容性问题及解决方法
明镜止水的博客
04-12 3345
下面将浏览器不兼容原因及解决方法整理一下，不足之处以后遇到再继续补充： **1. 文字大小不兼容** 同样14px的宋体字，ie下实际占高16px，下留白3px，firefox下实际占高17px，上留白1px，下留白3px。 文字大小不兼容解决方案： 给所有文字设定通用line-height值 **2.div高度不兼容：** firefox下div容器定义height后，
ASP.NET网站设计学习篇一
明镜止水的博客
04-17 1407
最近学习了HTML、CSS、JavaScript，进而结合已经拥有的C#基础，学习ASP.NET，学起来很快，加油！ 下面是网站的部分效果图： 主要代码如下： 足球小将 //此方法无效--%> $(document).ready(function () {
HTML5的新特性
明镜止水的博客
04-15 611
HTML5 中的一些有趣的新特性：1、用于绘画的 canvas 元素 2、用于媒介回放的 video 和 audio 元素 3、对本地离线存储的更好的支持 4、新的特殊内容元素，比如 article、footer、header、nav、section 5、新的表单控件，比如 calendar、date、time、email、url、search HTML5《video》元素同样拥有方法、
HTML/CSS/JavaScript教程：代码示例与角色解析
2. CSS（Cascading Style Sheets）则是用于表现HTML或XML（包括如SVG、MathML等各种XML方言）文档的样式语言。1.1.2节展示了一个CSS代码片段，它被插入到HTML的部分，用于定义元素的外观，如颜色、字体、布局等。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值