اذهب إلى المحتوى
  • 0

كيف أقوم بنقل العناصر عن طريق Bootstrap

Mohammed Hhhh

السؤال

Recommended Posts

  • 0
بتاريخ 30 دقائق مضت قال أسامة زيادة:

وعليكم السلام ورحمة الله وبركاته 

هل يمكنك إرفاق شيفرتك البرمجية حتى أستطيع معرفة ما قمت به ؟ 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" href="Style/style_mainpage.css">
    <script src="project_1/JavaScript/jsfile.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- nav bar -->
    <nav class="navbar fixed-top navbar-expend-lg navbar-dark p-md-3 ">
        <div class="container">
            <img src="/project_1/images/football.png" height="30px" width="30px" alt="">
            <div class="navbar-brand text-dark" style="font-weight: bold ;">Match</div>
            <a href="/project_1/login_pg.html" class="sing-in">Sing-in</a>
        </div>
    </nav>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
        crossorigin="anonymous"></script>
</body>
</html>

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 36 دقائق مضت قال Mohammmed Mahmoud:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" href="Style/style_mainpage.css">
    <script src="project_1/JavaScript/jsfile.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- nav bar -->
    <nav class="navbar fixed-top navbar-expend-lg navbar-dark p-md-3 ">
        <div class="container">
            <img src="/project_1/images/football.png" height="30px" width="30px" alt="">
            <div class="navbar-brand text-dark" style="font-weight: bold ;">Match</div>
            <a href="/project_1/login_pg.html" class="sing-in">Sing-in</a>
        </div>
    </nav>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
        crossorigin="anonymous"></script>
</body>
</html>

 

يمكنك وضع العنصرين في حاوية جديدة div واستخدام الخاصية float لضبط مكان كل عنصر بهذا الشكل . 

<nav class="navbar fixed-top navbar-expend-lg navbar-dark p-md-3 ">
        <div class="container">
            <div class="">
            <img src="/project_1/images/football.png" height="30px" width="30px" alt="" style="float: left;">
            <div class="navbar-brand text-dark" style="font-weight: bold ; float: right; margin-left: 20px;">Match</div>
        </div>
            <a href="/project_1/login_pg.html" class="sing-in">Sing-in</a>
        </div>
    </nav>

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...