【从零开始的Java开发】2-9-3 油画商城静态网页案例

最新推荐文章于 2024-06-30 12:46:56 发布
最新推荐文章于 2024-06-30 12:46:56 发布
阅读量467 收藏 4
点赞数
分类专栏： 从零开始的Java开发 文章标签： 前端 html css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/karshey/article/details/126649468
版权

文章目录

项目展示

页眉区，banner区
在这里插入图片描述
正文区
在这里插入图片描述
页脚区
在这里插入图片描述
总体效果
在这里插入图片描述

页面布局相关技术
在这里插入图片描述

项目：

0.准备工作

文件夹：
在这里插入图片描述

html：

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

<head>
    <meta charset="utf-8">
    <title>商城</title>
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="js/js1.js"></script>
</head>

<body>
</body>

</html>

image：
在这里插入图片描述

1.页眉区的制作

功能介绍：
在这里插入图片描述
实现思路：

  1. 制作左上方的logo：注意上边距、左边距的距离
  2. 制作菜单：注意菜单的位置、间距、打开效果
  3. 右侧的用户交互区：注意右边距的位置、水平位置
  4. 页眉区的尺寸和距离，注意要和下方banner区域的大
    小、位置相应一致

1-1.logo和menu位置的摆放

html：

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

<head>
    <meta charset="utf-8">
    <title>商城</title>
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="js/js1.js"></script>
</head>

<body>
    <!-- 页眉 -->
    <div class="header">
        <!-- logo -->
        <div class="logo">
            <img src="image/logo.png">
        </div>
        <!-- 菜单跟目录 -->
        <div class="menu">
            <div class="menu_title"><a href="">内容分类</div>
            <ul>
                <li>现实主义</li>
                <li>抽象主义</li>
            </ul>
        </div>
    </div>
    <!-- 正文 -->
    <div class="content"></div>
    <!-- 页脚 -->
    <div class="footer"></div>
</body>

</html>

css：

/*整体无间距*/
* {
    padding: 0px;
    margin: 0px;
}

/*logo离左、上的距离*/
.header {
    margin: 25px 0px 0px 50px;
}

/*子菜单不显示*/
.header .menu ul {
    display: none;
}

/*子菜单在logo右边：浮动*/
.header .logo {
    float: left;
    position: relative;
}

.header .menu {
    float: left;
    position: relative;
    /*让menu对齐*/
    margin-top: 12px;
    margin-left: 16px;
}

效果：
在这里插入图片描述

1-2.menu功能的实现

让鼠标浮动在菜单上时显示的css：

/*鼠标浮动在菜单上就让ul显示*/
.header .menu:hover ul {
    display: block;
}

让鼠标点击菜单时显示的js：

var flag = true;

//鼠标放到菜单上时就显示
function show_menu() {
    var menu1 = document.getElementById("menu1");
    if (flag) {
        //块状显示
        menu1.style.display = "block";
        flag = false;
    } else {
        menu1.style.display = "none";
        flag = true;
    }
}

让鼠标挪走时菜单自动关闭的js：

//鼠标离开则菜单隐藏
function show_menu1() {
    var menu1 = document.getElementById("menu1");
    menu1.style.display = "none";
    //要改变开关按钮
    flag = true;
}

html如下（主要是看事件添加在哪里）：

<!-- 菜单跟目录 -->
<div class="menu" onmouseleave="show_menu1()">
     <!-- #表示当前页面但不刷新页面 -->
     <div class="menu_title"><a href="#" onclick="show_menu()">内容分类</div>
     <ul id="menu1">
         <li>现实主义</li>
         <li>抽象主义</li>
     </ul>
 </div>

1-3.menu功能的样式

主要是：

  • 菜单的间距
  • 菜单前的原点符号要去掉
  • 菜单的边框

菜单前的原点符号要去掉css：

.header .menu ul {
    display: none;
    /*1-3*/
    /*去掉列表小圆点*/
    list-style: none;
}

菜单间距css：

/*1-3*/
/*菜单间距加大*/
.header .menu ul li {
    margin-top: 20px;
}

菜单的边框css：

.header .menu ul li {
    margin-top: 20px;
    /*文本居中*/
    width: 80px;
    text-align: center;
}

/*菜单边框*/
.header .menu .menu_title {
    border-bottom: 1px solid black;
    padding-bottom: 20px;
    width: 80px;
    text-align: center;
}

/*去掉超级链接的下划线*/
a {
    text-decoration: none;
}

效果：
在这里插入图片描述

1-4.登录与注册

有两种方法：

  • 标签里加超级链接
  • div+列表

我们用后者。

关于#：

  • #：不刷新页面，依然停留在当前页面
  • ###：锚点

html：

<!-- 登陆与注册 -->
<div class="auth">
     <ul>
         <li><a href="#">注册</li>
         <li><a href="#">登录</li>
     </ul>
 </div>

css：

/*1-4*/
/*登陆与注册*/
.header .auth {
    float: right;
    /*position: relative;*/
}

/*对齐方式与去掉原点*/
.header .auth ul li {
    float: left;
    list-style: none;
    margin-right: 70px;
    margin-top: 12px;
}

效果：
在这里插入图片描述

1-5.小结

  • 菜单的制作，要注意菜单的位置、利用js实现的弹出效
    果、菜单的外观样式。
  • 位置、对齐方式等细节设置

小技巧：

  • 可以在设置页面区域的同时，将banner图进行设置，方便
    进行位置参照
  • div逐层设置，仔细观察样式所选择的对象以及实现的效果
  • JS菜单效果设置

2.正文区的制作

2-1.页眉和banner区

html：

<!-- 正文 -->
    <div class="content">
        <div class="banner">
            <img src="image/welcome.png" class="banner_img">
        </div>
    </div>

相关的css：

/*子菜单不显示*/
.header .menu ul {
    display: none;
    /*1-3*/
    /*去掉列表小圆点*/
    list-style: none;

    /*单击目录后子菜单的显示：浮在图片上面*/
    position: absolute;
    width: 80px;
    background-color: white;
    /*半透明效果*/
    opacity: 0.5;
    color: black;
}

/*2-1.页眉和banner区制作*/
.content {
    width: 1200px;
    margin: 25px auto;
}

.content .banner .banner_img {
    margin-top: 30px;
}

效果：
在这里插入图片描述

2-2.商品展示区

一个粗略的商品展示：
html：

<li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>

显示：
在这里插入图片描述
加一点css：

/*2-2.商品展示区*/
.content .img_content ul {
    width: 1280px;
}

.content .img_content ul li {
    width: 361px;
    float: left;

    /*图片之间的左右间距*/
    margin: 0px 58px 60px 0px;

    list-style: none;
}

效果：
在这里插入图片描述
加上购物车css：

/*购物车*/
.img_content .info .img_btn {
    width: 300px;
}

.img_content .info .img_btn .btn {
    width: 60px;
    height: 30px;
    background-color: red;
    text-align: center;
    border-radius: 5px;
    float: right;
}

.img_content .info .img_btn .cart img {
    /*background-color: white;*/
    width: 25px;
    height: 20px;
    margin-top: 5px;

}

.img_content .info .img_btn .price {
    float: left;
}

效果：
在这里插入图片描述
再加一点细节：

.content .img_content ul li {
    width: 361px;
    height: 500px;
    float: left;

    /*图片之间的左右间距*/
    margin: 0px 58px 60px 0px;

    list-style: none;

    /*边框与阴影*/
    margin-top: 20px;
    box-shadow: 2px 2px 5px 3px grey;
    /*谷歌浏览器兼容*/
    -webkit-box-shadow: 2px 2px 5px 3px grey;
    /*火狐浏览器兼容*/
    -moz-box-shadow: 2px 2px 5px 3px grey;

    /*背景色*/
    background-color: white;

}

.info {
    margin-left: 30px;
    margin-right: 30px;

}

/*图片标题*/
.info h3 {
    color: red;
    font-size: 25px;
    margin-top: 20px;
    margin-bottom: 20px;
}

/*段落*/
.info p {
    /*行间距*/
    line-height: 30px;
    /*下边距*/
    margin-bottom: 10px;
}

/*价格*/
.info .price {
    color: red;
    font-size: 25px;


}

body {
    background-color: #F5F5F5;
}

效果：
在这里插入图片描述

2-3.分页区

关于span和div：

  • div在默认情况下单独占一行，span在默认情况下一起占一行。
  • div里可以加span，但span里不能加div。

html：

<div class="page_nav">
            <ul>
                <li><a href="#">首页</a></li>
                <li><a href="#">上一页</a></li>
                <!-- div在默认情况下单独占一行，span在默认情况下一起占一行 div里可以加span 但span里不能加div -->
                <li><span class="first_page">1</span></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#">...</a></li>
                <li><a href="#">98</a></li>
                <li><a href="#">99</a></li>
                <li><a href="#">下一页</a></li>
                <li><a href="#">尾页</a></li>
            </ul>
        </div>

css：

/*分页区*/
.content .page_nav ul li {
    float: left;
    margin-right: 15px;
    list-style: none;
}

.content .page_nav {
    /*width: 1200px;*/
    width: 100%;
    /*跟上级的宽度一样*/
    height: 60px;
    line-height: 60px;

    /*border: 1px solid black;*/
    overflow: hidden;

}

.content .page_nav ul {
    /*水平居中*/
    margin: auto;
    overflow: hidden;
    width: 500px;
}

/*给1加圆形阴影*/
.content .page_nav .first_page {
    border-radius: 50%;
    background-color: #c5c5c5;
    padding: 3px 9px;
}

效果：
在这里插入图片描述

2-4.小结

重难点：

  • 两行三列排列方式
  • 商品展示区两端对齐
  • 正文区三部分布局的统一：banner区、商品展示区、分页区

小技巧：

  • 位置：在进行页面布局时，位置和对齐十分重要
  • 什么时候添加div：有改变即添加div

3.页脚区的制作

html：

<!-- 页脚 -->
<div class="footer">
    <p><span>M-GALLARY</span>@2017 POWERED BY IMOOC.INC</p>
</div>

css：

/*页脚*/
.footer {
    width: 1200px;
    height: 100px;
    margin: 60px auto;
    /*用上边框来加线*/
    border-top: 1px solid #ccc;
    /*#ccc就是#cccccc*/
    overflow: hidden;
}

.footer p {
    text-align: center;
    line-height: 80px;
}

.footer span {
    color: deeppink;
}

效果：
在这里插入图片描述

项目总结

  • 整体布局时，各个对象的位置、对齐方式、间距等设置要注意细节，要通过计算的方式获取相互位置的对应关系。

  • ul和li的使用频率较高，非常适合于规律性显示的页面效果。

  • overflow:hidden、height、float直接的关系：
    在这里插入图片描述

  • 水平居中：margin:xpx auto;

  • 垂直居中：将line-height和height设置成相等的大小。

总体代码

html

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

<head>
    <meta charset="utf-8">
    <title>商城</title>
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="js/js1.js"></script>
</head>

<body>
    <!-- 页眉 -->
    <div class="header">
        <!-- logo -->
        <div class="logo">
            <img src="image/logo.png">
        </div>
        <!-- 菜单跟目录 -->
        <div class="menu" onmouseleave="show_menu1()">
            <!-- #表示当前页面但不刷新页面 -->
            <div class="menu_title"><a href="#" onclick="show_menu()">内容分类</div>
            <ul id="menu1">
                <li>现实主义</li>
                <li>抽象主义</li>
            </ul>
        </div>
        <!-- 登陆与注册 -->
        <div class="auth">
            <ul>
                <li><a href="#">注册</li>
                <li><a href="#">登录</li>
            </ul>
        </div>
    </div>
    <!-- 正文 -->
    <div class="content">
        <div class="banner">
            <img src="image/welcome.png" class="banner_img">
        </div>
        <div class="img_content">
            <ul>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="#" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="#" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="#" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="#" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <img src="image/wumingnvlang.jpg" class="img_li">
                    <div class="info">
                        <h3>无名女郎</h3>
                        <p>图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述图片描述</p>
                        <div class="img_btn">
                            <!-- 单价 -->
                            <div class="price">￥5800</div>
                            <!-- 按钮 -->
                            <a href="#" class="cart">
                                <div class="btn">
                                    <img src="image/cart.svg">
                                </div>
                            </a>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="page_nav">
            <ul>
                <li><a href="#">首页</a></li>
                <li><a href="#">上一页</a></li>
                <!-- div在默认情况下单独占一行，span在默认情况下一起占一行 div里可以加span 但span里不能加div -->
                <li><span class="first_page">1</span></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#">...</a></li>
                <li><a href="#">98</a></li>
                <li><a href="#">99</a></li>
                <li><a href="#">下一页</a></li>
                <li><a href="#">尾页</a></li>
            </ul>
        </div>
    </div>
    <!-- 页脚 -->
    <div class="footer">
        <p><span>M-GALLARY</span>@2017 POWERED BY IMOOC.INC</p>
    </div>
</body>

</html>

css

/*1-1*/

/*整体无间距*/
* {
    padding: 0px;
    margin: 0px;
}

/*logo离左、上的距离*/
.header {
    margin: 25px auto;
    /*上下25 左右auto*/
    width: 1200px;
}

/*子菜单不显示*/
.header .menu ul {
    display: none;
    /*1-3*/
    /*去掉列表小圆点*/
    list-style: none;

    /*单击目录后子菜单的显示：浮在图片上面*/
    position: absolute;
    width: 80px;
    background-color: white;
    /*半透明效果*/
    opacity: 0.5;
    color: black;
}

/*子菜单在logo右边：浮动*/
.header .logo {
    float: left;
    position: relative;
}

.header .menu {
    float: left;
    position: relative;
    /*让menu对齐*/
    margin-top: 12px;
    margin-left: 16px;
}

/*1-2*/
/*鼠标浮动在菜单上就让ul显示*/
/*.header .menu:hover ul {
    display: block;
}*/

/*1-3*/
/*菜单间距加大*/
.header .menu ul li {
    margin-top: 20px;
    /*文本居中*/
    width: 80px;
    text-align: center;

}

/*菜单边框*/
.header .menu .menu_title {
    border-bottom: 1px solid black;
    padding-bottom: 20px;
    width: 80px;
    text-align: center;
}

/*去掉超级链接的下划线*/
a {
    text-decoration: none;
}

/*1-4*/
/*登陆与注册*/
.header .auth {
    float: right;
    /*position: relative;*/
}

/*对齐方式与去掉原点*/
.header .auth ul li {
    float: left;
    list-style: none;
    margin-right: 70px;
    margin-top: 12px;

}

/*2-1.页眉和banner区制作*/
.content {
    width: 1200px;
    margin: 25px auto;
}

.content .banner .banner_img {
    margin-top: 30px;
}

/*2-2.商品展示区*/
.content .img_content ul {
    width: 1280px;
}


.content .img_content ul li {
    width: 361px;
    height: 500px;
    float: left;

    /*图片之间的左右间距*/
    margin: 0px 58px 60px 0px;

    list-style: none;

    /*边框与阴影*/
    margin-top: 20px;
    box-shadow: 2px 2px 5px 3px grey;
    /*谷歌浏览器兼容*/
    -webkit-box-shadow: 2px 2px 5px 3px grey;
    /*火狐浏览器兼容*/
    -moz-box-shadow: 2px 2px 5px 3px grey;

    /*背景色*/
    background-color: white;

}

.info {
    margin-left: 30px;
    margin-right: 30px;

}

/*图片标题*/
.info h3 {
    color: red;
    font-size: 25px;
    margin-top: 20px;
    margin-bottom: 20px;
}

/*段落*/
.info p {
    /*行间距*/
    line-height: 30px;
    /*下边距*/
    margin-bottom: 10px;
}

/*价格*/
.info .price {
    color: red;
    font-size: 25px;


}

body {
    background-color: #F5F5F5;
}

/*购物车*/
.img_content .info .img_btn {
    width: 300px;
}

.img_content .info .img_btn .btn {
    width: 60px;
    height: 30px;
    background-color: red;
    text-align: center;
    border-radius: 5px;
    float: right;
}

.img_content .info .img_btn .cart img {
    /*background-color: white;*/
    width: 25px;
    height: 20px;
    margin-top: 5px;

}

.img_content .info .img_btn .price {
    float: left;
}


/*分页区*/
.content .page_nav ul li {
    float: left;
    margin-right: 15px;
    list-style: none;
}

.content .page_nav {
    /*width: 1200px;*/
    width: 100%;
    /*跟上级的宽度一样*/
    height: 60px;
    line-height: 60px;

    /*border: 1px solid black;*/
    overflow: hidden;

}

.content .page_nav ul {
    /*水平居中*/
    margin: auto;
    overflow: hidden;
    width: 500px;
}

/*给1加圆形阴影*/
.content .page_nav .first_page {
    border-radius: 50%;
    background-color: #c5c5c5;
    padding: 3px 9px;
}

/*页脚*/
.footer {
    width: 1200px;
    height: 100px;
    margin: 60px auto;
    /*用上边框来加线*/
    border-top: 1px solid #ccc;
    /*#ccc就是#cccccc*/
    overflow: hidden;
}

.footer p {
    text-align: center;
    line-height: 80px;
}

.footer span {
    color: deeppink;
}

js

var flag = true;

//鼠标放到菜单上时就显示
function show_menu() {
    var menu1 = document.getElementById("menu1");
    if (flag) {
        //块状显示
        menu1.style.display = "block";
        flag = false;
    } else {
        menu1.style.display = "none";
        flag = true;
    }
}

//鼠标离开则菜单隐藏
function show_menu1() {
    var menu1 = document.getElementById("menu1");
    menu1.style.display = "none";
    //要改变开关按钮
    flag = true;
}

总体效果

在这里插入图片描述

karshey
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
HTML + CSS + JS做一个绘画分享网站[开源项目]
FanSheep的博客
04-27 573
声明:1.此项目仅仅代码开源，DrawPark是此博客的产权，严禁盗用 2.此项目暂时是静态网站 先看一下效果图吧！预览网址:https://drawpark.rth.app/ HTML代码 ​ <!DOCTYPE html> <html lang="zh-cn" dir="ltr"> <head data-info="{&quot;v&quot;:&quot;1.0.8125.42964&q...
java项目实战 作品_JavaWeb项目实战-油画商城
weixin_33594195的博客
03-02 437
整个项目都已经上传到github-mmgallery上，供有需要的读者使用，主要文件来自于csdn，区别是csdn中的项目数据存储在MySQL中，本项目数据存储在Xml文件中。课件和学习视频课程来自MK网 Java工程师2020第二阶段。1.MVC架构模式早期代码：显示与代码耦合，一个页码中既有html网页，也有Java代码，代码混乱且可读性差int max=Integer.parseInt()%...
html + css实现油画商场页面
想好了就去做吧 即便失败了 至少这条路上留下了你的脚印
06-03 861
aa
基于OpenCV实现的图像油画效果代码(高效率、低耗时的C++代码-带详细注释)
昊虹AI笔记
06-20 719
本文实现的图像油画效果代码原理如下：一、将原图进行灰度化处理后将灰度值线性压缩到0~level，得到图像①；二、用一个窗去遍历中图像①中的每一个像素，统计出窗覆盖区域出现次数最多的灰度等级，并记录下具体出现的次数，并记为most_times，同时把原图中的BGR三通道像素值分别累加，用BGR三通道累加和除以most_times，得到一个平均BGR值，用这个平均BGR值作为目标图像中对应像素的值。三、重复上面的过程直到遍历完毕图像①，就得到了油画效果的图像。从上面的原理叙述来看，原理不难，但问题就在于如何高效
html弄出油画效果,使用HTML5 Canvas实现仿PS图像油画滤镜特效
weixin_28685483的博客
06-03 499
JavaScript语言：JaveScriptBabelCoffeeScript确定var canvas = document.getElementById("canvas"),ctx = canvas.getContext("2d"),img = new Image(),effectEl = document.getElementById("effect"),settings = {radius...
Javaweb项目实战：油画商城。第一集----预备工作！！！GOGOGOGO！！疫情当头，学习别停！！！完整源代码，在尾部，自取。谢谢。
可及的小屋
02-24 626
先总的说下这个油画商城吧！ 所需技能点： Servlet控制器 JSP展示数据 JavaBean封装和处理数据 JDBC数据管理 文件上传 AJAX 所需环境： Eclipse 使用的MySQL数据库进行数据存储。一共三张表。一个是用户表。还有一个是商品表和商品分类表 我们首先看下三张表的结构吧 具体的建库代码如下 CREATE DATABASE /*!32312 IF NOT EXIS...
从零开始的Java开发 笔记目录（跑路了）
karshey的博客
07-13 180
。
opencv3 java开发手册_介绍一本opencv不错的书-OpenCV3使用Java开发手册
weixin_42394088的博客
02-13 537
你们好http://www.topteam.cc/02-shop-detail.php?cid=&sid=&pid=896Opencv 不但有趣并且是免费的视觉相关开发软体，它可以加速您学习影像处理、光学辨识、以及机器学习强大的预测能力，可激发您的想像力，以创造无限可能性。本书特点：◎内容涵盖机器学习、光学辨识、影像处理◎具320多个范例，含2.x(2.4.13)、3.x(3.1)...
3-6岁油画棒画金枪鱼.ppt
03-04
3-6岁油画棒画金枪鱼
image-process.rar_图像油画_油画 java
09-20
这个名为"image-process.rar_图像油画_油画_java"的压缩包文件显然包含了一些Java代码，用于实现图像的油画风格转换，以及可能的水波和老照片效果。下面将详细解释这些知识点。 1. **图像处理**：图像处理是指通过...
JavaWeb小白——项目实战——油画商城源码.zip
03-12
JavaWeb小白——项目实战——油画商城源码 对应本人置顶文章，带你从头到尾，体验。 源代码仅供学习，仅供学习。
Javaweb项目实战：油画商城。第三集—-分类模块的实现！！！GOGOGOGO！！疫情还在，别乱跑呢，学习别停！！！
12-22
由于近期准备机试内容，断更了下。 我思考了思考，还是继续更吧。 万一有人看呢 对你万一有帮助呢？ 谁说的准哦 唉。。 人 生 难 得 一 zhi ji 这次的内容是实现分类模块 需求是我们可以展示数据库中有的分类 并添加新的分类到数据库之后跳转到展示分类的页面，展示数据库中所有的分类 当然也可以删除，删除后，跳转到展示分类的页面，展示数据库中所有的分类 也可以修改某个分类，修改后跳转到展示分类的页面，展示数据库中所有的分类 好啦，首先是Servlet的实现，我们在coding的时候不是把所有的功能都写完哈， 而是写一个功能，接着继续往下深入到Service，再到dao 如果你的需求明确，也可
行业文档-设计装置-带油画笔的毛笔.zip
08-23
2. 油画笔的特点：油画笔通常具有较硬的刷毛，能够承载和释放大量颜料，适合厚涂技法，创造出丰富的质感和层次感。油画笔的特性使其在油画创作中广泛应用，能够表现出鲜明的色彩和立体效果。 3. 毛笔的特点：毛笔是...
教育科研-学习工具-一种便捷式油画笔.zip
08-12
2. **技术原理**：在教育科研背景下，这款油画笔可能采用了先进的传感器技术和图像处理算法，以捕捉用户的手部动作和力度，实现对画布上颜色和纹理的精确控制。这些技术细节对于理解产品的创新之处和潜在的教学价值...
行业文档-设计装置-带油画笔的水彩笔.zip
08-23
2. **软件应用**：与硬件配套的软件通常会包含各种绘画工具和效果模拟，如模拟油画和水彩的混合、流动、干燥等特性。这可能需要复杂的算法来实现，例如物理渲染技术，以尽可能接近真实材料的表现。此外，软件可能还...
Javaweb项目实战：油画商城。第二集----实体类的创建和登录模块的实现！！！GOGOGOGO！！疫情当头，学习别停！！！
可及的小屋
02-24 535
嗯，长夜慢慢无心睡眠，继续写这个的第二篇。就当做是回顾了。 上篇我们说到，建表和包结构。接下来就是实体类啦。 Javabean 一共需要这些 具体的代码如下。用eclipse自带的生成工具去生成对应的get和set方法，还有toString方法都可以自动生成。别自己写。那是累傻小子呢！！！ 一定注意，一定注意！ package com.imooc.domain; public class Use...
油画商城项目
qq_44095347的博客
09-12 466
项目需求 一、主页面 logo：css设置位置和浮动 菜单栏：无序列表，列表样式为none，隐藏，js鼠标事件，鼠标滑入显示，滑出隐藏 登录注册跳转，css设置位置浮动 banner区：css设置样式 5. 商品展示区：设置整体的位置大小。 图片宽度360像素，间隔60像素 标题 h3标签，设置颜色，设置外边距 正文 p标签，字体大小颜色，间距，两端对齐，设置外边距 价格 颜色，位置，编剧，宽高 购物车 图片缩小，添加背景颜色，圆角，宽高，浮动，边距 6. 页码区，使..
前端面试题（12）答案版
最新发布
weixin_49062485的博客
06-30 591
在不同的操作系统上,设置环境变量的方式有所不同,比如在Windows上使用set命令,在Unix/Linux上使用export命令。-2） setImmediate：是Node.js中的特有API,属于微任务,会被添加到微任务队列中,在事件循环的微任务阶段执行。2) 执行完所有宏任务后,检查微任务队列(如Promise.then)是否有待执行的任务,依次执行。- 1）setTimeout：是宏任务,会被添加到宏任务队列中,在事件循环的宏任务阶段执行。在前端面试中,考察这些基本概念是非常常见的。
JavaScript检查对象是否包含某个属性
徐三岁的博客
06-28 909
当使用 Object.prototype.hasOwnProperty.call 时，实际上是在调用 hasOwnProperty 方法，并明确指定 this 的值，这使得可以检查任何对象是否拥有指定的属性。使用 Object.prototype.hasOwnProperty.call 的好处是，它允许将 hasOwnProperty 方法作为一个函数传递给其他函数，或者在不直接引用对象的情况下使用它。hasOwnProperty 方法会检查对象自身是否具有指定的属性，而不考虑原型链。
Java 从零开始实现一个画图板、以及图像处理功能，代码可复现.doc
07-08
"Java从零开始实现一个画图板及图像处理功能的代码教程，包含丰富的图形绘制和图像操作，适合Java初学者。" 在Java编程中，开发一个画图板和图像处理程序是一个很好的实践项目，可以帮助学习者深入理解图形用户界面...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

karshey

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值