请有人评估我的代码并告诉我哪里出错了?

时间:2018-04-24 14:40:25

标签: html html5 web

我是网络新手,这是我的第一个项目......

我感觉好像我做错了布局,

我可能会使用太多的div?

我的css是独立的,我对css非常有信心但是我现在想让这个网页响应,对我自己来说最简单的方法是什么?我在猜媒体查询?

我总是遇到布局和事物定位的问题

感谢您的帮助,非常感谢



<div class="bottom">

    <div class="licensetxt">

        <h2>License</h2>
        <a name="Link"></a>
        <br>

        <input type="button" id="btnx" style="background-image:url('arrowup.png')" />
        <!-- <img style="position:absolute; left:1100px; top:815px; width:40px; padding: 1px; margin: 1px" src="arrowup.png"> -->


        <h4>License Agreement</h4>

        <p>By purchasing these (“sounds”) you are granted a license to use these sounds for specific uses under the conditions set out below. Ownership remains with the creator Wingman Inc Ltd, and you are required to abide by the following licensing terms.</p>

        <h4>Rights</h4>

        <p>
            This license grants the purchaser an ongoing, non-exclusive, worldwide license.
            You are licensed to use the sounds to create products for yourself or for your clients.
            You may modify the sounds according to your requirements and use them royalty free in your personal and commercial projects. For example, you may use these sounds in an application, website or mobile app you will be designing for a client.
        </p>

        <p>Wingman Inc Ltd will not be responsible for any outcome that may occur during the course of usage of these resources.</p>

        <h4>Prohibitions</h4>

        <p>
            This license prohibits the redistribution, resell, lease, license, sub-license or offer of the file downloaded to any third party.
            For any resalable web applications or mobile software programs, you should not include these sounds as an additional attachment meant for purchase, such as In App Purchasing. This will be considered as a redistribution of our resources which is forbidden by us and pursuant under European Law.
        </p>


    </div>


    <div class="sound">
        <img style="position:absolute; left:620px; top:1400px; width:50px; padding: 1px; margin: 1px;" src="sound-icon-grey@2x.png">
    </div>

</div>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

响应

使网站响应媒体查询可能需要花费大量时间。经常太多时间。

  1. 我建议学习像bootstrap 4

  2. 这样的框架
  3. 媒体查询仍然是必须的。您需要扩展字体和其他内容。

  4. 另请参阅REM for fonts,em for padding等。他们也可以帮助您。

答案 1 :(得分:0)

1:我做错了吗?

好吧,学习网络开发是一个过程,你的代码从一开始就不会很完美,但通过实践它会变得更好。

您可以查看HTML5语法。在这里你将使用article / main / section和一些其他标签而不是div,这将有助于提高可读性。

2:如何使其响应?

你可以将事物的宽度基于父div的宽度(显示:块;在css中,这将使子div占父div宽度的100%)。详细了解此here

您还可以使用媒体查询。这些旨在根据屏幕大小进行更重要的设计更改。您可以在here上找到更多信息。