Macromedia Dreamweaver 8—页面三剑客之一与我的故事

来源：互联网发布：提高英语水平的软件编辑：程序博客网时间：2024/05/16 16:06

网页设计从来就是不是过时的事情,从小编我从Editplus写脚本,网页,到eclipse大型程序.今天来讲讲Macromedia Dreamweaver 8的故事.
先来说说它的界面吧.一打开,就是这样的界面
由图可知我们可以编写什么项目,有HTML,最基本的,包括javascript,脚本.还有css网页样式.这些都可以编辑,你以为这样就完了 ?不不不,几乎所有的网页编写软件,不管是代码还是图形,都能建立这些项目.
下面我来给大家介绍一下如何用MD来建立一个网页.
首先是工具栏,这个软件都有什么
只要是有一点软件基础的同学就知道这是非常简洁的页面
建立网页首先需要建立站点,有站点才能泼上网,至于上传服务器这又是后话了.站点的建立在站点—新建站点就可以了.
第一个就是起名,什么都可以,第二个就是你的网址,当然需要花钱注册.这样我们就可以建立网页了
打开文件新建—HTML先建立一个最基础的网页,当然了一片空白,需要我们加东西.
首先我们看一下工具栏,代码和设计非常有用,设计就是直接画出你的网页,代码就是写出代码来显示你的网页.当然右边的地球就是用浏览器显示,也就是查看效果.
而设计主要是三个部分,表格,层,框架.先说三者区别,表格可以随意调大小,但不能调左上方位置,层可以随意移动并且改变大小,而框架不能随意移动和改变大小
大家一定会说,那层这末好为啥不用层.我觉得可能是因为层太卡了,放东西太多就会卡.所以大家尽量用表格.方便快捷.
表格里面可以插入图片,文字,啥都行,表格的嵌套也行.忘了说了,所有的表格,层,框架,图像都在插入工具栏下
接下来就是你做网页的事了,发挥你的艺术天赋.
代码方面以后会讲,可能大家对于代码也有些了解,这里就不赘述.
其实代码方面我也有写,之前做移动互联网做了一个手机音乐播放器的页面.
代码如下:
<!doctype html>
<html>
    <head>
    
     <meta http-equiv="content-Type" content="text/html" charset="UTF-8"/>
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
         <title>qqmusic</title>
        <style type="text/css">
            *{margin:0;padding:0;}
            body{background:url("images/bg.jpg");background-size:cover;font-size:12px;font-family;"宋体";color:#33ff33;}
            /*start music*/

            .music{width:325px;height:577px;margin: 40px auto;position:relative;}
         .music .m-info{height:20px;background:url("images/top0.png");}
            .music .m-top{height:42px;background:url("images/phone_top.png");}
            .music .m-title{height:40px;background:#000000;text-align:center;line-height:40px;font-size:
            18px;border-left:1px solid#ffffff;border-right:1px solid #ffffff;}
            .music
            .m-con{height:500px;background:url("images/arry.jpg");background-size:cover;border-left:1px solid #ffffff;border-right:1px solid #ffffff;overflow:auto;}
            .music .m-bottom{height:73px;background:url("images/phone_bottom.png");}
            .music .m-btn{width:40px;height:40px;display:block;background:url("images/musiclll.png");background-size:cover;position:absolute;top:125px;right:30px;border-radius:50%;}
            .music .m-con .lrc{line-height:30px;font=size:14px;color:#66ff33;padding-left:20px;}

            /*end music*/
            /*旋转*/
            @-webkit-keyframes music{
                from{
                    -webkit-transform:rotate(0deg)
                    }to{
                        -webkit-transform:rotate(360deg)}
                    }
            }.arry{
                -webkit-animation: music 1.2s linear infinite;
            }


        </style>

</head>
<body>
    

    <div class="music">
        <div class="m-top"></div>
        <div class="m-info"></div>
        <div class="m-title">music</div>
        <div class="m-con"></div>
        <div class="m-bottom"></div>
        <a herf="#" class="m-btn"></a>

    </div>

    <script type="text/javascript" src="js/jQuery-1.11.1.min.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function($) {

     $('.m-btn').click(function() {
     alert('OK');
     });
    });
</script>

    </div>
</body>
</html>
可能写的有点简单,大佬不要在意.这个代码使用editplus写的.
结果:
最后奉劝大家一句,做网页一定分好包,图,html文件.否则乱套就完了,不要问我怎么知道的.
当然写代码用editplus先得建好包,其中有css,images,js,mp3这些包.
代码详解就不说了,难者不会,会者不难.

10.小编我是一个下午就学完了基本的操作,做了网页.可以说非常好玩,建议大家尝试.大家可以看到我第一个新建图里可以看到我正好完成了一个项目.一个果园的项目,班里同学创业大赛要用.总之快乐生活每一天,开开心心写程序.认真过好每一天.Dream it,got it!

0 0