Lansional 2024-03-14 16:51 采纳率: 88%
浏览 7
已结题

电影海报制作,怎样使图片居左,文字居右?

怎样使我运行的结果如下图:

img


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h1>
        <span property="v:itemreviewed">功夫</span>
        <span class="year">(2004)</span>
    </h1>

    <div class="grid-16-8 clearfix">

        <div class="article">


            <div class="indent clearfix">
                <div class="subjectwrap clearfix">
                    <div class="subject clearfix">

                        <div id="mainpic" class="">

                            <img src="功夫.jpg" alt="功夫" rel="v:image" width="200" />

                        </div>

                        <div id="info">
                            <span><span class='pl'>导演</span>: <span class='attrs'><a href="/celebrity/1048026/"
                                        rel="v:directedBy">周星驰</a></span></span><br />
                            <span><span class='pl'>编剧</span>: <span class='attrs'><a href="/celebrity/1299569/">曾瑾昌</a>
                                    / <a href="/celebrity/1280434/">陈文强</a> / <a href="/celebrity/1048026/">周星驰</a> / <a
                                        href="/celebrity/1287182/">霍昕</a></span></span><br />
                            <span class="actor"><span class='pl'>主演</span>: <span class='attrs'><a
                                        href="/celebrity/1048026/" rel="v:starring">周星驰</a> /
                                    <a href="/celebrity/1304876/" rel="v:starring">元秋</a> /
                                    <a href="/celebrity/1050240/" rel="v:starring">元华</a> /
                                    <a href="/celebrity/1005110/" rel="v:starring">黄圣依</a> /
                                    <a href="/celebrity/1274267/" rel="v:starring">梁小龙</a> /
                                    <a href="/celebrity/1229775/" rel="v:starring">陈国坤</a>/更多
                                    <br />
                                    <span class="pl">类型:</span> <span property="v:genre">喜剧</span> / <span
                                        property="v:genre">动作</span> / <span property="v:genre">犯罪</span> / <span
                                        property="v:genre">奇幻</span><br />

                                    <span class="pl">制片国家/地区:</span> 中国大陆 / 中国香港<br />
                                    <span class="pl">语言:</span> 粤语 / 汉语普通话 / 手语<br />
                                    <span class="pl">上映日期:</span> <span property="v:initialReleaseDate"
                                        content="2004-12-23(中国大陆/中国香港)">2004-12-23(中国大陆/中国香港)</span> / <span
                                        property="v:initialReleaseDate"
                                        content="2015-01-15(中国大陆3D)">2015-01-<br />15(中国大陆3D)</span> /
                                    <span property="v:initialReleaseDate"
                                        content="2004-09-14(多伦多电影节)">2004-09-14(多伦多电影节)</span><br />
                                    <span class="pl">片长:</span> <span property="v:runtime"
                                        content="100">100分钟(3D重映)</span> /
                                    95分钟(中国大陆) / 99分钟(美国)<br />
                                    <span class="pl">又名:</span> 功夫3D / Kung Fu Hustle<br />
                                    <span class="pl">IMDb:</span> tt0373074<br>

</body>

</html>

运行结果如下图:

img

  • 写回答

2条回答 默认 最新

  • W_柒 2024-03-14 17:15
    关注

    方法1. flex 布局

    img

    方法2.修改元素类型

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 3月22日
  • 已采纳回答 3月14日
  • 创建了问题 3月14日