不二如是 发表于 2017-3-13 14:48:39

已有 9 人购买  本主题需向作者支付 2 鱼币 才能浏览 购买主题

MSK 发表于 2018-7-31 11:11:06

交作业~


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Canvas高逼格标语</title>
</head>
<body>
    <canvas id="mycanvas" width="1400" height="999">大哥, 你的浏览器不支持canvas~</canvas>
    <script>
      context = document.getElementById("mycanvas").getContext("2d");
      context.fillStyle = "#a00";
      context.fillRect(0, 0, 1400, 640);
      var img = new Image();
      img.src = "img.jpg";
      img.onload = function (){
            context.drawImage(img, 20, 40);
      };
      context.fillStyle = "#000";
      context.font = "33px monospace";
      context.fillText("托尼", 350, 100);
      context.font = "25px monospace";
      context.fillText("你可以摧毁我的房子,我的装备,但是你摧毁不了一个事实,我是钢铁侠。", 350, 160);
    </script>
</body>
</html>

上帝也幽默 发表于 2018-9-2 22:32:41

本帖最后由 上帝也幽默 于 2018-9-2 22:47 编辑

交作业~
话说这里如何使用代码设置图片尺寸{:10_254:}

alltolove 发表于 2017-3-13 16:12:43

学习了{:10_256:}

不二如是 发表于 2017-3-13 16:33:59

alltolove 发表于 2017-3-13 16:12
学习了

{:10_281:}

aswyamato1989 发表于 2017-8-23 23:31:04

交作业！

隨鈊乄鎍慾 发表于 2018-7-21 11:29:05

交作业：

freeulove 发表于 2019-7-7 22:04:24

老师是真的牛皮啊，每天跟着学习，很有收获，谢谢你们的付出

suweixuan1998 发表于 2020-1-13 13:41:57

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鱼C工作室</title>
    <style type="text/css">
      html.body{
            height: 100%;
            margin: 66px;
            padding: 0;
      }
    </style>
</head>
<body>
<canvas id="mycanvas" width="1111" height="999">大哥，你的浏览器不支持Canvas～</canvas>
<script type="text/javascript">
    var canvas=document.getElementById("mycanvas");
    var context=canvas.getContext("2d");
    context.fillStyle="#99F";
    context.fillRect(0,0,850,450);
    var img = new Image();
    img.src = "2.jpg";
    img.onload = function () {
      context.drawImage(img,100,200)
    }
    context.fillStyle = "#FFF";
    context.font = '33px Adobe Ming Std';
    context.fillText("怎么得到你想要的？",380,170);

    context.fillStyle = "#FF3";
    context.font = '66px Adobe Ming Std';
    context.fillText("让自己配得上Ta！",300,280)
</script>
</body>
</html>

希望后续能够学会用代码修改图片尺寸

小脑斧 发表于 2020-4-9 20:24:15

页: [1]
查看完整版本: 0 0 7 7 - 超高B格的Canvas标语