dropdown افقی با استفاده از بوت استرپ چهار

Question

درباره Mohsen

تلاشگر

پاسخ ها ( ۴ )

فاطمه چهاردولی
3
۱۳۹۹-۰۳-۰۶ در ۱۵:۵۳

پاسخ دادن
سلام بفرمایید شاید مشکلتون حل بشه.

فاطمه چهاردولی

3

۱۳۹۹-۰۳-۰۶ در ۱۵:۵۲

پاسخ دادن

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/mycss.css">
    <title>darsman</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
</head>
<style>
    .dropdown-menu {
        margin-right: -1000px;
    }
    
    .dropdown-menu>li {
        display: inline-block;
    }
</style>

<body>
    <nav class="navbar navbar-default navbar-static-top" role="navigation">
        <ul class="nav navbar-nav">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">List Item</a>
                <ul class="dropdown-menu">
                    <li><a href="#" id="">1</a></li>
                    <li><a href="#" id="">2</a></li>
                    <li><a href="#" id="">1</a></li>
                    <li><a href="#" id="">2</a></li>
                    <li><a href="#" id="">3</a></li>
                    <li><a href="#" id="">4</a></li>
                    <li><a href="#" id="">5</a></li>
                    <li><a href="#" id="">6</a></li>
                </ul>
            </li>
        </ul>
    </nav>
    <script src="../js/jquery-3.4.1.slim.min.js "></script>
    <script src="../js/popper.min.js "></script>
    <script src="../js/bootstrap.min.js "></script>
    
</body>

</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

<!DOCTYPE html>

<head>

<title>darsman</title>

</head>

<style>

.dropdown-menu {

margin-right: -1000px;

}

.dropdown-menu>li {

display: inline-block;

}

</style>

<body>

</ul>

</li>

</ul>

</nav>

</body>

</html>

فاطمه گلشنی پایدار
2
۱۳۹۹-۰۳-۱۹ در ۱۴:۰۳

پاسخ دادن
عرض سلام
کد مربوط به dropdown که شما نوشتین برای bootstrap 3 هست و در bootstrap 4 کار نمی کنه!

ارسال یک پاسخ

سوال قبلی

سوال بعدی

فاطمه گلشنی پایدار · Accepted Answer · ۱۳۹۹-۰۳-۱۹

سلام و عرض ادب

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Horizontal Dropdown</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
</head>

<body>
    <div class="dropdown">
        <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown"
            aria-haspopup="true" aria-expanded="false">
            Dropdown button
        </button>
        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
            <a href="#">Action</a>
            <a href="#">Another action</a>
            <a href="#">Another action</a>
            <a href="#">Another action</a>
            <a href="#">Another action</a>
            <a href="#">Another action</a>
            <a href="#">Something else here</a>
        </div>
    </div>

    <script src="js/jquery-3.4.1.slim.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
</body>

</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

<!DOCTYPE html>

<head>

<title>Horizontal Dropdown</title>

</head>

<body>

<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown"

aria-haspopup="true" aria-expanded="false">

Dropdown button

</button>

<a href="#">Action</a>

<a href="#">Another action</a>

<a href="#">Something else here</a>

</div>

</body>

</html>

درباره Mohsen

پاسخ ها ( ۴ )

ارسال یک پاسخ

Ahmad Ziaeii : سلام دوست

talebi.dev : class Bank

talebi.dev : students_g

اکنون ثبت نام کنید

ورود

فراموشی پسورد

ورود

اکنون ثبت نام کنید

dropdown افقی با استفاده از بوت استرپ چهار