搜索“bootstrap” -技术 - 个人学习记录

taotaoit 1 0

1443 0 2021-09-19 Bootstrap5

bootstrap5中使用flex布局支持响应式比如，pc版需要右对齐，手机版需要左对齐那么就可以 <div class="d-flex justify-content-start justify-content-lg-end "> <div>123</di...

bootstrap5实现响应式边框

taotaoit 1 0

1289 0 2021-09-19 Bootstrap5

有时候我们需要pc版有边框，手机版没边框， bootstrap5好像没有对应的响应式，可以自己写一个 css @media (min-width: 992px) { .border-lg-end{ border-right: 1px solid #dee2e6 !important; } .bord...

bootstrap5实现左右居中 .mx-auto

taotaoit 1 0

2161 0 2021-09-15 Bootstrap5

bootstrap5实现左右居中 .mx-auto css： .mx-auto { margin-right: auto !important; margin-left: auto !important; } 响应式 .mx-sm-auto .mx-md-auto .mx-lg-auto .m...

bootstrap5文字截断，超出部分显示省略号，多行文字截断

taotaoit 5 0

3980 0 2021-09-14 Bootstrap5

bootstrap5对于较长的内容，可以添加.text-truncate类别，以省略号截断文字。需为display: inline-block或是display: block。  <div class="row"> <di...

bootstrap5 按钮大小

taotaoit 0 1

1305 0 2021-09-02 Bootstrap5

bootstrap5 按钮大小添加.btn-lg or .btn-sm设置按钮大小 <button type="button" class="btn btn-primary btn-lg">Large button</button> <button type="button" class="b...

bootstrap5 表单控件大小

taotaoit 0 0

1318 0 2021-09-02 Bootstrap5

bootstrap5 表单控件大小使用诸如.form-control-lg 和 .form-control-sm之类的类设置高度。 <input class="form-control form-control-lg" type="text" placeholder=".form-control-lg" aria-l...

bootstrap5 offcanvas-navbar手机滑动导航，左右滚动导航

taotaoit 1 1

1674 0 2021-09-02 Bootstrap5

效果图示例链接 https://taotaoit.com/demo/?url=other/other-119/index 直接上代码 <!doctype html> <html lang="en"> <head> <meta charset="utf...

bootstrap5 flex布局占据剩余空间flex-grow-1

taotaoit 0 0

1376 0 2021-08-28 Bootstrap5

bootstrap5 flex布局占据剩余空间.flex-grow-1 .flex-grow-1{flex-grow:1!important} 参考：https://taotaoit.com/demo/bootstrap5/167.html

bootstrap5宽度100% .w-100高度100% .h-100，没有对应的自适应样式

taotaoit 0 0

2596 0 2021-08-28 Bootstrap5

bootstrap5宽度100% .w-100高度100% .h-100 /* 宽度 */ .w-25{width:25%!important} .w-50{width:50%!important} .w-75{width:75%!important} .w-100{width:100%!important} .w-auto{wid...

bootstrap5圆角按钮，胶囊按钮，实现直角rounded-0，大圆角rounded-3，小圆角rounded-1

taotaoit 4 0

2505 0 2021-08-28 Bootstrap5

默认按钮自带圆角 .btn{border-radius:.25rem!important} .rounded{border-radius:.25rem!important} .rounded-0{border-radius:0!important} .rounded-1{border-radius:.2rem!imp...

bootstrap5 上下左右边框.border-top,.border-bottom,.border-start,.border-end

taotaoit 1 0

1831 0 2021-08-26 Bootstrap5

bootstrap5 上下左右边框 <span class="border"></span> <span class="border-top">上</span> <...

bootstrap5 .img-fluid类让图片支持响应式布局，bootstrap3是.img-responsive

taotaoit 2 0

2734 0 2021-08-26 Bootstrap5

bootstrap5 .img-fluid类让图片支持响应式布局，bootstrap3是.img-responsive bootstrap5，bootstrap4都是.img-fluid css样式 .img-fluid{max-width:100%;height:auto} bootstrap3 cs...

bootstrap5相对定位.position-relative绝对定位.position-absolute固定定位.position-fixed粘性定位.position-sticky

taotaoit 2 0

1828 0 2021-08-23 Bootstrap5

bootstrap5相对定位.position-relative绝对定位.position-absolute固定定位.position-fixed粘性定位.position-sticky css样式 .position-static { position: static !important; } .position-...

bootstrap5 内容左对齐.text-start 居中.text-center 右对齐.text-end

taotaoit 2 0

1552 0 2021-08-23 Bootstrap5

bootstrap5 内容左对齐.text-start 居中.text-center 右对齐.text-end css样式 .text-start { text-align: left !important; } .text-end { text-align: right !important; } .text-...

bootstrap5独立的分页css .pagination

taotaoit 0 0

1216 0 2021-08-21 Bootstrap5

css /* 分页 */ .fy{padding: 1rem 0;} .pagination { display: flex; padding-left: 0; list-style: none; justify-content: center; } .page-link { position: relative...

bootstrap5 .float-start .float-end .float-none和bootstrap4 .float-left .float-right

taotaoit 0 0

1425 0 2021-08-04 Bootstrap5

css样式 bootstrap5 .float-start{float:left!important} .float-end{float:right!important} .float-none{float:none!important} bootstrap4 .float-left{float:left!imp...

加载更多

关于本站