Python之路57-前端快速开发

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Python之路57-前端快速开发相关的知识,希望对你有一定的参考价值。

适用于全栈

BootStrap

css、js


学习BootStrap规则

1.响应式

@media

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .c1{
            background-color: red;
            height: 50px;
        }
        @media (min-width: 900px) {
            .c2{
                background-color: gray;
            }
        }
    </style>
</head>
<body>
    <div class="c1 c2"></div>
</body>
</html>

2.图标、字体

@font-face


3.基本使用

样式有优先级强制生效方式

.no-radus{
    background-radius: 0 !inportant;
}


适用于后台管理


jQueryUI

css、js

学习jQueryUI规则


EasyUI

css、js

学习EasyUI规则



轮播图

bxslider

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="jquery.bxslider/jquery.bxslider.css" />
</head>
<body>
    <ul class="bxslider">
        <li><img src="images/1.jpg" /></li>
          <li><img src="images/2.jpg" /></li>
          <li><img src="images/3.jpg" /></li>
          <li><img src="images/4.jpg" /></li>
    </ul>
    <script src="jquery-1.12.4.js"></script>
    <script src="jquery.bxslider/jquery.bxslider.js"></script>
    <script>
        $(document).ready(function(){
            $(‘.bxslider‘).bxSlider();
        });
    </script>
</body>
</html>


本文出自 “八英里” 博客,请务必保留此出处http://5921271.blog.51cto.com/5911271/1926678

以上是关于Python之路57-前端快速开发的主要内容,如果未能解决你的问题,请参考以下文章

前端开发工具vscode如何快速生成代码片段

Python之路--前端知识--jQuery

前端学习之路,前端开发人员如何在团队中规范git commit提交记录

前端进阶之路-二如何用gulp搭建一套web前端开发框架

python全栈开发之路

VS Code配置snippets代码片段快速生成html模板,提高前端编写效率