HTML5
  • html+css+js如何实现弹球游戏?(代码示例)

    本篇文章通过代码示例来给大家介绍使用html+css+js实现弹球游戏的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。使用html+css+js实现弹球游戏代码如下,复制即可使用:!doctypehtml
    head
    styletype=text/css
    .panel{
    position:relative;
    z-index:0;
    top:0px;
    left:400px;
    width:300px;
    height:500px;
    }
    .console{
    position:absolute;
    z-index:1;
    top:0;
    left:0;
    width:100%;
    height:40px;
    background-color:#bbb;
    }
    .message{
    position:absolute;
    z-index:1;
    top:40px;
    left:0;
    width

    2020-07-22 0 0 0 0
  • 快速掌握网格布局(grid)常用属性

    本篇文章给大家介绍一下网格布局(grid)的常用属性。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。和flex布局不同的是,网格布局(grid)是一个二维的布局,可以创建任意行列的布局。首先来介绍几个概念;想象一个三行三列的布局,网格线就是构成网格所有的线条,三行三列的布局每行就会有4条网格线。网格轨道就是相邻两条平行的网格线之间的部分。和flex布局一样,他会有父容器和子项目,在这儿我们称为网格容器和网格项。接下来,我们从网格容器到网格项的各个基本属性来介绍网格布局。网格容器网格容器是决定将网

    2020-07-20 0 0 0 0
  • 如何实现三栏布局(圣杯布局、双飞翼布局)?

    如何实现三栏布局(圣杯布局、双飞翼布局)?下面本篇文章给大家介绍一下实现三栏布局(圣杯布局、双飞翼布局)的四种方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。圣杯布局、双飞翼布局,本质上都是三栏布局──中间自适应两边固定宽。圣杯布局圣杯HTML结构:divclass='main'
    divclass=middle中间的/div
    divclass=left左边的/div
    divclass=right右边的/div
    /div双飞翼布局双飞翼HTML结构为:divclass='main'
    divclass=middle
    divclass=inner_middle中间的/div
    /div
    divclass=left左边

    2020-07-14 0 0 0 0
  • html5使用svg的方法步骤

    SVG是一种图像文件格式,它的英文全称为Scalable Vector Graphics,意思为可缩放的矢量图形。本文就来为大家介绍一下html5使用svg的方法。创建svg文件:?xmlversion=1.0standalone=no?
    !DOCTYPEsvgPUBLIC-//W3C//DTDSVG1.1//EN
    http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd
    svgwidth=100%height=100%version=1.1
    xmlns=http://www.w3.org/2000/svg
    circlecx=100cy=50r=40stroke=black
    stroke-width=2fill=red/
    /svg在html中引入svg:方式一:objectdata=test.svg
    type=image/svg+xml
    codebase=http://www.adobe.com/svg/vi

    2020-07-12 0 0 0 0
  • HTML前端教程-利用HTML5 canvas旋转图片实例演示

    最近突然想研究一下js旋转图片的功能。对于之前的实现方式,就不先说了。现在HTML5很不错,主要了解一下HTML5中的图片旋转吧。实例演示:http://www.imqing.com/demo/rotateImg.html原理:利用canvas对象来旋转。实现方式:首先创建一个canvas元素,然后把img元素绘入canvas。但是,实际上,这是默认情况,就是图片没旋转时。如果图片要旋转90度的话,就需要先把canvas画布旋转90度后再绘图。描述如下:内部旋转原理是这样的,图片的坐标是从左上角开始计算,向右为x正方向,向下为y正方向,在旋转画布canvas时,实际上是这个坐标在旋转,

    2020-07-11 0 0 0 0
  • HTML前端教程-HTML中name、id、class的区别介绍

    在一个页面中,有许多的控件(元素或标签)。为了更方便的操作这些标签,就需要给这些标签标识一个身份牌。在HTML中有name、id、class等属性区分一个元素,下面我们就来看一下这几种属性的区别。1. name指定标签的名称。1.1 格式inputtype=textname=username/1.2 应用场景①form表单:name可作为转递给服务器表单列表的变量名;如上面的传到服务器的名称为:username='text的值'。②input type='radio'单选标签:把几个单选标签的 name设为一个相同值时,将会进行单选操作。inputtype=radioname='sex'/男
    inputtyp

    2020-07-07 0 0 0 0
  • HTML前端教程-使用XML及XSL生成简单HTML的方法介绍

    某些时候需要生成HTML展现数据,考虑过XML加XSL方法吗?比如,以html邮件的方式发送一些数据。本文通过两个已经存在的文件,xml文件和xsl文件演示如何将其转换成HTML。首先,准备XML文件,这里为了演示,随便定义了一组数据。这些定义好的数据用于后面套入到对应的xsl模板中。ROOT
    ASPNETXUsername=duduCity=ShanghaiCool=70/
    ASPNETXUsername=BillCity=MeiguoCool=100/
    ASPNETXUsername=GatesCity=MeiguoCool=100/
    ASPNETXUsername=AobamaCity=MeiguoCool=80/
    ASPNETXUsername=aspnetxCity=BeijingCool=60/
    ASPNETXUsername=GeoCity

    2020-07-07 0 0 0 0
  • HTML前端教程-你必须知道的一些HTML优化技巧

    如何提升Web页面的性能,很多开发人员从多个方面来下手如JavaScript、图像优化、服务器配置,文件压缩或是调整CSS。很显然HTML 已经达到了一个瓶颈,尽管它是开发Web 界面必备的核心语言。HTML页面的负载也是越来越重。大多数页面平均需要40K的空间,像一些大型网站会包含数以千计的HTML 元素,页面Size会更大。如何有效的降低HTML 代码的复杂度和页面元素的数量,本文主要解决了这个问题,从多个方面介绍了如何编写简练,清晰的HTML 代码,能够使得页面加载更为迅速,且能在多种设备中运行良好。在设计和开发过程中需要遵循以下原则:结构

    2020-07-06 0 0 0 0
  • HTML前端教程-HTML中的meta标签属性使用介绍

    之前学习前端中,对meta标签的了解仅仅只是这一句。meta charset=UTF-8但是打开任意的网站,其head标签内都有一列的meta标签。下面我们就来详细介绍一下meta标签。在查阅w3school中,第一句话中的“元数据”就让我开始了Google之旅。然后很顺利的在英文版的w3school找到了想要的结果。The meta tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable.不难看出,其中的关键是metadata,中文名叫元数据,是用于描述数据的数据。它不会显示在页面上,但是机器却可以识别

    2020-07-06 0 0 0 0
  • HTML前端教程-HTML几种基础控件介绍

    本文主要介绍html中的input、select、textarea、label、fieldset、ul、ol、li等标签。希望对大家有一定的帮助。1. input标签input 标签用于搜集用户信息。1.1 type属性根据不同的 type 属性值,输入字段拥有很多种形式。可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。text:文本区域readonly属性:是否只读。password:密码区域,输入的文本以'*'展示checkbox:复选框checked属性:是否选中;radio:单选框;name属性:指定多个单选框的在一个区域里进行单选操作reset:重置当前form表单里所有标签到初始化状态

    2020-07-05 0 0 0 0
ots网络logo

OTS网络安全门户主要提供网络信息安全教程、文章、工具,让更多的小伙伴加入我们的社区一起学习。

技术支持: 建站ABC | 管理登录