复式日麻随机牌山2.0版本（纯html+js）实现

最新推荐文章于 2024-10-18 16:48:21 发布

wukefei2003

最新推荐文章于 2024-10-18 16:48:21 发布

阅读量635

点赞数

文章标签： html html5 css

本文链接：https://blog.csdn.net/wukefei2003/article/details/120412798

版权

9.25更新，优化了CSS样式，提供了一个纯HTML和JavaScript实现的复式日麻随机牌山2.0版本。用户只需将代码复制到.html文件并用浏览器打开即可体验。

摘要由CSDN通过智能技术生成

9.25更新：修改了网页的css样式，看起来可能更加舒服

使用方法：新建.html文件，然后把下面的代码复制进去，最后再浏览器中打开即可

<style>
    img {
        height: 45px;
    }

    li {
        float: left;
        height: 140px;
        width: 48%;
    }
</style>

<body>
    <ul>
        <li>
            <p>东家的手牌</p>
            <img src="" id="s1">
        </li>
        <li>
            <p>东家的牌山</p>
            <img src="" id="p11"><br>
            <img src="" id="p12">
        </li>
        <li>
            <p>南家的手牌</p>
            <img src="" id="s2">
        </li>
        <li>
            <p>南家的牌山</p>
            <img src="" id="p21"><br>
            <img src="" id="p22">
        </li>
        <li>
            <p>西家的手牌</p>
            <img src="" id="s3">
        </li>
        <li>
            <p>西家的牌山</p>
            <img src="" id="p31"><br>
            <img src="" id="p32">
        </li>
        <li>
            <p>北家的手牌</p>
            <img src="" id="s4">
        </li>
        <li>
            <p>北家的牌山</p>
            <img src="" id="p41"><br>