Detailed Travel Itinerary in HTML

<!DOCTYPE html>
<html>
<head>
    <title>Travel Itinerary: Nanjing to Changchun</title>
    <style>
        body { font-family: Arial, sans-serif; }
        .itinerary { margin: 20px; }
        .day { margin-bottom: 20px; }
        .header { font-size: 24px; font-weight: bold; }
        .sub-header { font-size: 18px; font-weight: bold; }
    </style>
</head>
<body>
    <div class="itinerary">
        <div class="header">Travel Itinerary: Nanjing to Changchun</div>
        <div class="sub-header">Dates: {{start_date}} to {{end_date}}</div>
        <div class="sub-header">Budget: {{budget}} RMB</div>

        <div class="day">
            <div class="sub-header">Day 1: Arrival in Changchun</div>
            <p><strong>Flight:</strong> {{flight_details}}</p>
            <p><strong>Hotel:</strong> {{hotel_name}} - Located in city center, comfortable and affordable</p>
            <p><strong>Weather:</strong> {{weather_forecast}}</p>
            <p><strong>Packing Tips:</strong> ${packingRecommendations}</p>
        </div>

        <div class="day">
            <div class="sub-header">Day 2: Exploring Changchun</div>
            <p><strong>Attractions:</strong> {{attraction1}} (Ticket: ${ticketPrice1}, Open: ${openTime1})</p>
            <p><strong>Lunch:</strong> Try local cuisine at {{restaurant1}}</p>
            <p><strong>Afternoon:</strong> Visit ${attraction2} (Ticket: ${ticketPrice2}, Open: ${openTime2})</p>
            <p><strong>Dinner:</strong> Enjoy a meal at ${restaurant2}</p>
            <p><strong>Transportation:</strong> ${transportDetails}</p>
        </div>

        <!-- Repeat similar blocks for Day 3, Day 4, etc. -->
        
        <div class="day">
            <div class="sub-header">Day 5: Departure</div>
            <p><strong>Return Flight:</strong> ${returnFlightDetails}</p>
        </div>

    </div>
</body>
</html>

<!DOCTYPE html>  
<html>  
<head>  
    <title>旅行行程单：南京至长春</title>  
    <style>  
        body { font-family: Arial, sans-serif; }  
        .itinerary { margin: 20px; }  
        .day { margin-bottom: 20px; }  
        .header { font-size: 24px; font-weight: bold; }  
        .sub-header { font-size: 18px; font-weight: bold; }  
    </style>  
</head>  
<body>  
    <div class="itinerary">  
        <div class="header">旅行行程单：南京至长春</div>  
        <div class="sub-header">日期：{{start_date}} 至 {{end_date}}</div>  
        <div class="sub-header">预算：{{budget}} 元人民币</div>  

        <div class="day">  
            <div class="sub-header">第 1 天：抵达长春</div>  
            <p><strong>航班：</strong>{{flight_details}}</p>  
            <p><strong>酒店：</strong>{{hotel_name}} —— 位于市中心，舒适且经济实惠</p>  
            <p><strong>天气：</strong>{{weather_forecast}}</p>  
            <p><strong>行李打包建议：</strong>${packingRecommendations}</p>  
        </div>  

        <div class="day">  
            <div class="sub-header">第 2 天：游览长春</div>  
            <p><strong>景点：</strong>{{attraction1}}（门票：${ticketPrice1}，开放时间：${openTime1}）</p>  
            <p><strong>午餐：</strong>在{{restaurant1}}品尝当地美食</p>  
            <p><strong>下午：</strong>参观${attraction2}（门票：${ticketPrice2}，开放时间：${openTime2}）</p>  
            <p><strong>晚餐：</strong>在${restaurant2}享用美食</p>  
            <p><strong>交通：</strong>${transportDetails}</p>  
        </div>  

        <!-- 为第 3 天、第 4 天等重复类似区块 -->  

        <div class="day">  
            <div class="sub-header">第 5 天：返程</div>  
            <p><strong>返程航班：</strong>${returnFlightDetails}</p>  
        </div>  

    </div>  
</body>  
</html>