精华内容
参与话题
问答
  • 一个正规的网站开发,理论上需要一个团队的配合,各自发挥自己的长处,网站需求分析、原型设计、效果图、切图、前台美工、后台代码、算法设计、数据库设计、服务器配置等等一系列的事情。  一个人想面面俱到这些...
    一个正规的网站开发,理论上需要一个团队的配合,各自发挥自己的长处,网站需求分析、原型设计、效果图、切图、前台美工、后台代码、算法设计、数据库设计、服务器配置等等一系列的事情。

     一个人想面面俱到这些,还是需要花些时间的。所以对一个初学者来说,我的建议是:别管他三七二十一,不是想开发一个网站吗,别管懂不懂,先开发出来一个再说,在开发的过程中,遇到了问题,再找解决方案的过程中,自己获得了学习,等完成了一个网站,乱七八糟的知识也学了一些,有了一个感性的认识,再去系统性的、深入的去学习也不晚。

      这里提供一个我的开发思路和具体实现的方法:

      开发一个网站,大概是这些东西:

      1.有个整体的网站页面的样子,我们姑且称之为前端开发。

      2.前端有了,点击里面的按钮、链接、新增信息、修改信息等等的操作,需要后台编码,姑且称之为后台开发。

      3.前端有了,后台有了,数据放哪里啊,因此需要用到数据库了,姑且称之为数据库开发。

      4.前面一通完成后,网站可以看了,接下来需要找服务器发布了,姑且称之为网站发布。

      5.网站发布了,如果想让别人通过一个域名去访问,因此需要绑定域名了,姑且称之为域名绑定。

      6.大功告成,回过头来消化一下吧。姑且称之为回味无穷。

      接下来详细介绍。(建议先通读一下,别一上来就陷入某一个细节)

      一、前端开发

      1.先拿笔找张纸,大概想想自己网站有哪些页面,每个页面是什么样子,如果没有灵感,就上网乱逛一阵,借鉴一下别人的做法。

      2.网站大概样子心中有数了,接下来要开发了,别自己从头写代码了,可以用前端框架,各种前端框架我也不对比,也别让你挑的头疼,就用bootstrap吧,网址:http://getbootstrap.com/,twitter的工程师开发的,很多网站有用,开发一个凑合的网站不成问题。说白了,就是给你提供了css、javascript文件,对于一些页面布局、javascript效果,不用自己去写了,可以直接按照官方的说明去操作。具体的说明可以看官方网站,别嫌人家是英文的,其实没有几个单词你不认识,找找先练练,找找感觉。

      3.什么?过程中遇到了html、css、javascript等等问题,不明白的话,建议上这个网站扫个盲:http://www.w3school.com.cn/,自己再练练手,知识应该就够了。

      经过前面三步,应该能够开发出来一个差不多的效果的网站了,大概用上一个星期去看吧,足够了。

      注意:前端开发的过程中不用想着后端怎么实现?例如点击一个按钮怎么实现功能?专心开发前端页面就行了。前端和后端是独立分离的,只需要很小的整合就可以了。

      二、后台开发

      1.如果前端的页面都开发好了,接下来要实现页面上一些功能性的东西了,如果注册、登陆等等功能,就要后台开发了,这里我也建议用框架,后台开发框架也是海了去了,就用Thinkphp的吧,国产的框架,还行,套路还是比较明显的。网址:http://www.thinkphp.cn/,是PHP的,什么?没有学过PHP,以前学的是C#?java?等等,别担心,学一下php也花不了多长时间,关键是一边学ThinkPHP,一边就把PHP给学了吧。如何学习ThinkPHP,可以看官方的文档就好,如果看不懂,可以看一下这个哥们的视频教程:http://www.thinkphp.cn/document/258.html,讲的还是不错的。

      2.看完视频教程还是有些不解,什么乱七八糟MVC了等等概念,不用着急,继续前进吧,可能慢慢就能理解了,谁说不理解就不能前进的,是不?

      注意:这个过程可能有点儿难,不过也还是可以接受的,学明白了,以后修改起来会比较灵活,至少感觉比wordpress灵活。

      三、数据库开发

      1.后台开发过程中,要存一下数据,难免要用到数据库,那么就安装一下mysql吧, 如果觉得不好管理,可以再安装一个可视化的工具:Navicat,需要用什么表,就建什么表吧,反正以后觉得不合适了还要修改。

      2.如果数据库一点儿也不懂,那么网上随便搜搜相关知识,大概熟悉熟悉,会建表、增减数据就行了。有些数据库操作,用ThinkPHP的框架,非常简单的,不需要自己考虑太多东西。

      注意:数据库开发是要配合着后台开发一起的。大概后台开发完了,数据库也差不多建好了。

      四、网站发布

      1.有很多托管代码的服务器,有收费的,有免费的,我就推荐一个吧,用新浪的SAE,速度还可以的,刚开始就先找一个尝试吧,等以后有时间了,可以再尝试尝试别家的。这里SAE是支持ThinkPHP的SAE版本。因此上传上去代码就能看效果了,发布后网址大概样子为:****.sinaapp.com

      2.SAE是按访问流量收费的,弄一个实名认证,会送流量的,对于刚开始的网站,足够用了;如果不放心,可以申请一个中级开发者,每个月都会赠流量。之前是微博有加V就可以申请中级开发者,微博加V传一个自己的工作照就可以了。现在我的中级开发者,有需要推荐的,我也可以帮一下忙,反正我也不怎么用。

      3.如果想本地查看,可以安装一个Apache,至于部署,也不难。

      注意:能到发布这一步,我想应该就没有什么难的了吧。虽然曾经我与新浪各种死磕,今天还是无私的为他做了广告,我代表新浪,谢谢我自己了。(请别说我调皮)

      五、域名绑定

      1.网站建好了,如果感觉****.sinaapp.com不好看,想用自己的域名,也是可以的。

      2.去godaddy申请吧,为啥是godaddy,别人都说好,我也就用了,反正我申请了两个域名,到现在都不怎么用,就当玩儿了。

       3.有域名了,就可以登陆SAE后台,绑定域名了,操作步骤,会有很详细的说明。

      六、回味无穷

      1.经过前面一系列过程,一个你认为还可以的网站应该就可以诞生了。

      2.过程中还有哪些想学的知识,可以去学习了。

      3.开发完一个网站,这一套模板可以保存下来,再开发别的网站,自己也可以用了。

      4.多年以后,你会觉得你的网站好low,不过又能如何,这也是一种人生体味而已。


    展开全文
  • web网页开发

    万次阅读 2018-09-19 11:08:22
    这里主要总结,web网页开发,即我们经常所看见的淘宝,新闻等网页。我们将一个所见的网页中每次刷新不变的部分,称为静态。这些静态由HTML和CSS组成,他们形成了网页的样式。HTML是一种标记语言,用来结构化我们的...
    这里主要总结,web网页的开发,即我们经常所看见的淘宝,新闻等网页。我们将一个所见的网页中每次刷新不变的部分,称为静态。这些静态由HTML和CSS组成,他们形成了网页的样式。HTML是一种标记语言,用来结构化我们的网页内容和赋予内容含义(形成树形结构),例如定义段落、标题、和数据表,或在页面中嵌入图片和视频。CSS 是一种样式规则语言,例如设置背景颜色和字体,内容的排版,然后我们将这些样式应用于我们的HTML。

    可参考教程:MDN


    一个简单的HTML文件人下所示:

    <!DOCTYPE html>
    <html>
    	<head>
    	/*head主要有HTML的标题,指定你的文档中字符的编码,作者和描述,在HTML中应用CSS和JavaScript等	*/
    		<meta charset="UTF-8">
    		<title></title><!--标题-->
    		<link rel="stylesheet" type="text/css" href="css/css.css"/><!--引用外部css-->
    		<style type="text/css">/*使用内部CSS*/
    			.hello{
    //    设置class=hello的样式
    				color: red;
    			}
    		</style>
    	</head>
    	<body>
    	//body是HTML的主要内容,描述了页面的结构。
    		<h1>hello</h1>
    		<div class="hello">	
    		</div>
    	</body>
    	<script src="js/main.js" type="text/javascript" charset="utf-8"></script><!--引用外部js-->
    	<script type="text/javascript">/*使用内部js*/
    		var hello=document.querySelector(".hello");<!—采用DOM的API,引用html中的元素-->
    		var newhello=document.createElement("button");<!--新建html中的元素-->
    		newhello.textContent="botton";//设置这个元素的属性以及内容
    		hello.appendChild(newhello);<!--在元素后面新插入元素-->
    		newhello.onclick()=function (){
    			/*onclick 为鼠标点击事件
    			 鼠标点击时,触发事件,运行后面的函数function*/
    		}
    		function hanshu (){
    //			单独的函数
    		}
    	</script>
    </html>
    
    
    如果说HTML和css帮助我们完成了页面上的样式的设计,那么JavaScript就帮助我们完成与用户之间的交互,如用户点击,滑动,输入等。Js(JavaScript的简称)是一种编程语言,允许你创建动态更新的内容,控制多媒体,图像动画,和一些其他的东西。JS通过对HTML上元素的引用对网页上产生的事件(浏览器中发生的动作,例如点击按钮,加载页面或播放视频)进行响应。

    大多数现代的web站点是动态的—它们在服务端使用各种类型的数据库来存储数据(服务器), 之后通过运行服务器(server-side) 代码来重新获取需要的数据,把其数据插入到静态页面的模板中,并且生成出HTML渲染到用户浏览上。为此使用HTTP/HTTPS协议在 Web 上进行数据交换,并在数据传输的过程中需经过DNS和TCP/IP 协议。它是client-server协议。客户端和服务端通过交换各自的消息(与数据流正好相反)进行交互。由像浏览器这样的客户端发出的消息叫做 requests,被服务端回应的消息叫做
    responses。它是应用层的协议,通过TCP(HTTP),或者是TLS(加密的TCP ,HTTPS)连接来发送。

    举个例子:
    当你在浏览器里输入一个网址时(在我们的例子里就是走向商店的路上时):

    1. 浏览器在域名系统服务器(DNS)上找出存放网页的服务器的实际地址(IP地址)(找出商店的位置)。
    2. 浏览器发送 HTTP 请求信息(数据的传输遵守TCP/IP 协议)到服务器来请拷贝一份网页到客户端(你走到商店并下订单)。
    3. 服务器同意客户端的请求后,会返回一个“200 OK”信息,同意传输,然后开始将网页的文件以数据包的形式传输到浏览器。
    4. 浏览器将数据包聚集成完整的网页然后将网页呈现给你。

    这样一个简单的网页就完成了,但是在实际过程中,仍会许多问题。比如:HTTP是无状态的:在同一个连接中,两个执行成功的请求之间是没有关系的。这就带来了一个问题,用户没有办法在同一个网站中进行连续的交互,比如在一个电商网站里,用户把某个商品加入到购物车,切换一个页面后再次添加了商品,这两次添加商品的请求之间没有关联,浏览器无法知道用户最终选择了哪些商品。再比如:如果传输的数据较多,较大,那么每次交互时,均重新请求时,用户需等待较长时间,体验不好。为解决这些问题,开发人员们设计了AJAX,缓存,web worker,CORS等技术。


    Asynchronous JavaScript and XML(Ajax):异步,指无需重新加载整个页面的情况下,只更新部分页面的技术。主要是通过XMLHttpRequest ()(通常缩写为XHR)或 Fetch()来请求。为了进一步提高速度,有些网站还会在首次请求时将资产和数据存储在用户的计算机上,这意味着在后续访问中,他们将使用本地版本,而不是在首次加载页面时下载新副本。 内容仅在更新后从服务器重新加载。XHR允许你使用它的 onload 事件处理器来处理这个事件 — 当onload 事件触发时(当响应已经返回时)这个事件会被运行。
    image
    AJAX代码:

    var request = new XMLHttpRequest();
    request.open('GET, url);
    request.responseType = 'text';//XHR默认返回文本,可修改格式
    request.onload = function() { 
    var.textContent = request.response;//返回 };
    request.send();
    
    

    与XHR不同,fetch()返回一个解析HTTP响应的promise,它将解析从服务器发回的响应。我们使用then()来运行一些后续代码,这是我们在其内部定义的函数。这相当于XHR版本中的onload事件处理程序。
    Fetch代码:

    fetch(url).then(function(response) {
    response.text().then(function(text)
     {//text() 也返回了一个 promise 
    var.textContent = text;
    }
    }
    
    

    对于前面所说的,将资产和数据存储在用户的计算机上,主要才采取cookie,sessionStorage和 localStorage。这些参数均可在浏览器的开发者模式中application中查看。Cookie可以采用http头部扩展的方式,把Cookies添加到头部中,创建一个会话让每次请求都能共享相同的上下文信息,达成相同的状态。注意,HTTP本质是无状态的,使用Cookies可以创建有状态的会话。sessionStorage,只要浏览器开着,数据就会一直保存 (关闭浏览器时数据会丢失)。localStorage,一直保存数据,甚至到浏览器关闭又开启后也是这样。每个域都有一个单独的数据存储区,无法交错使用。Session,由于HTTP协议是无状态的协议,所以服务端需要记录用户的状态时,就需要用某种机制来识具体的用户.典型的场景比如购物车,当你点击下单按钮时,由于HTTP协议无状态,所以并不知道是哪个用户操作的,所以服务端要为特定的用户创建了特定的Session,用用于标识这个用户,并且跟踪用户,这样才知道购物车里面有几本书。这个Session是保存在服务端的,有一个唯一标识。Session是在服务端保存的一个数据结构,用来跟踪用户的状态,这个数据可以保存在集群、数据库、文件中;
    Cookie是客户端保存用户信息的一种机制,用来记录用户的一些信息,也是实现Session的一种方式。

    如果你的网站需跨域,去获取资源,则需要使用CORS(Cross-Origin Resource Sharing)技术。这是HTML5定义的如何跨域访问资源的方法。Origin表示本域,也就是浏览器当前页面的域。当JavaScript向外域(如sina.com)发起请求后,浏览器收到响应后,首先检查Access-Control-Allow-Origin是否包含本域,如果是,则此次跨域请求成功,如果不是,则请求失败,JavaScript将无法获取到响应的任何数据。
    假设本域是my.com外域是sina.com,只要响应头Access-Control-Allow-Origin为http://my.com,或者是*,本次请求就可以成功。
    可见,跨域能否成功,取决于对方服务器是否愿意给你设置一个正确的Access-Control-Allow-Origin,决定权始终在对方手中。

    展开全文
  • 教你写一个简单的网页(html网页开发入门)

    万次阅读 多人点赞 2017-10-16 15:02:49
    网页的组成 HTML  网页的具体内容和结构 CSS  网页的样式(美化网页最重要的一块) JavaScript  网页的交互效果,比如对用户鼠标事件作出响应 HTML 什么是HTML HTML的全称是...

    网页的组成

    HTML 
    网页的具体内容和结构

    CSS 
    网页的样式(美化网页最重要的一块)

    JavaScript 
    网页的交互效果,比如对用户鼠标事件作出响应

    HTML

    什么是HTML

    HTML的全称是HyperTextMarkupLanguage,超文本标记语言 
    其实它就是文本,由浏览器负责将它解析成具体的网页内容

    比如,浏览器会将下面的HTML代码

    <ul>
        <li>知乎</li>
        <li>CSDN</li>
        <li>博客园</li>
    </ul>
    • 1
    • 2
    • 3
    • 4
    • 5

    转化为 
    知乎 
    黑马 
    CSDN 
    的网页内容

    HTML的组成

    跟XML类似,HTML由N个标签(节点、元素、标记)组成

    HTML语法非常松散

    常见的HTML标签

    • 标题:h1,h2,h3,h4,h5…
    • 段落:p
    • 换行:br
    • 容器:div,span(用来容纳其他标签)
    • 表格:table,tr,td
    • 列表:ul,ol,li
    • 图片:img
    • 表单:input
    • 链接:a 
      推荐开发工具(网络三剑客)dreamweawer、flash、fireworks;WebStorm.
    <html>
        <!-- 网页的标题、图标... -->
        <head>
            <mate charset="utf-8">
            <title>第一个网页</title>
        </head>
        <!-- 网页的具体内容 -->
        <body>
            这是网页的内容
            <a href="http://www.baidu.com" target="_blank">百度</a>
    
            <h1>666666666</h1>
            <h2>666666666</h2>
            <h3>666666666</h3>
            <h4>666666666</h4>
            <h5>666666666</h5>
    
            <p>ppppppppppp</p>
    
        <div>
            <p>ppppppppppp</p>
        </div>
    
            <ul>
                <li>hahaha</li>
                <li>hahaha</li>
                <li>hahaha</li>
            </ul>
    
            <ol>
                <li>ahahah</li>
                <li>ahahah</li>
                <li>ahahah</li>
            </ol>
    
        <img src="text.png">
        </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

    CSS

    什么是CSS

    CSS的全称是Cascading Style Sheets,层叠样式表 
    它用来控制HTML标签的样式,在美化网页中起到非常重要的作用

    CSS的编写格式是键值对形式的,比如

    color : red 
    background-color : blue 
    font-size : 20px 
    冒号左边的是属性名,冒号右边的是属性值

    CSS三种书写方式

    • 行内样式:(内联样式)直接在标签的style属性中书写
    <span style="color:red;background-color:red;">123</span>
    • 1
    • 内页样式:在本网页的style标签中书写
    <span>123</span>
    <style type="text/css">
        span {
            color:yellow;
            background-color:blue
        }
    </style>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    外部样式:在单独的CSS文件中书写,然后在网页中用link标签引用 
    test.css

    span {
            color:yellow;
            background-color:blue
        }
    • 1
    • 2
    • 3
    • 4

    test.html

    <span>123</span>
    <link rel="stylesheet" herf="test.css">
    • 1
    • 2

    CSS选择器

    选择器的作用

    选择对应的标签,为之添加样式

    标签选择器 根据标签名找到标签

    类选择器 标签可以有多个类

    id选择器 id是唯一的,不能一样

    选择器组合 中间不留空格,粘在一起

    后代选择器 中间一个空格,不管嵌套多少层

    相邻兄弟选择器

    属性选择器

    <html>
    <head lang="en">
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            /*标签选择器*/
            p{
                color:red;
            }
            /*类选择器*/
            .first{
                color:red;
            }
            .second{
                color:blue;
            }
            /*id选择器*/
            #first{
                color:yollew;
            }
            #second{
                color:green;
            }
            /*群组选择器*/
            .first, #second, h1{
            }
            /*选择器组合*/
            div.first{
            }
            /*后代选择器*/
            div p{
            }
            /*子标签选择器*/
            div > p{
            }
            /*相邻兄弟选择器*/
            divp{
            }
            /*属性选择器*/
            div[name]{
            }
            div[name][age]{
            }
            div[name="jack"]{
            }
        </style>
    
    </head>
    <body>
        <div>
            <p>p1</p>
            <span>
                <p>p2</p>
            </span>
        </div>
        <div name="jack">div1</div>
        <div age="10">div2</div>
        <p>与div相邻的p</p>
    
        <div class="first">123</div>
        <div id="first">123</div>
    
        <p class="first second">123</p>
        <p id="second">123</p>
    
        <h1>hhh</h1>
    </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
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68

    伪类

    属性 描述
    :active 向被激活的元素添加样式
    :focus 向拥有键盘输入焦点的元素添加样式
    :hover 当鼠标悬浮在元素上方时,向元素添加样式
    :link 向未被访问的链接添加样式
    :visited 向已被访问的链接添加样式
    :first-child 向元素的第一个子元素添加样式
    :lang 向带有指定lang属性的元素添加样式
    :first-letter 向文本的第一个字母添加特殊样式
    :first-line 向文本的首行添加特殊样式
    :before 在元素之前添加内容
    after 在元素之后添加内容
    <html>
    <head lang="en">
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            div {
                width:100px;
                height:100px;
                background-color:red;
            }
            div:hover{
                background-color:blue;
            }
            div:before{
                content:"666";
            }
        </style>
    
    </head>
    <body>
        <div>
    
        </div>
    </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

    选择器优先级

    针对性越强,优先级越高 
    选择器的权值 
    通配选择符(*):0 
    标签:1 
    :10 
    属性:10 
    伪类:10 
    伪元素:1 
    id:100 
    important:1000

    原则:选择器的权值加到一起,大的优先;如果权值相同,后定义的优先 
    important > 内联 > id > 类 > 标签|伪类|属性选择器 > 伪元素 > 通配符 > 继承

    CSS标签的类型

    HTML有N多标签,根据显示的类型,主要可以分为2大类

    块级标签,独占一行的标签 
    行内标签(内联标签),多个行内标签能同时显示在一行

    修改标签的显示类型

    CSS中有个display属性,能修改标签的显示类型

    属性 说明
    none 隐藏标签
    block 块级类型,独占一行,能随时设置宽度和高度
    inline 行内类型(内联类型),多个行内标签可以显示在同一行,宽度和高度取决于内容尺寸
    inline-block 行d内-块级类型(内联-块级类型),多个行内标签可以显示在同一行,能随时设置宽度和高度

    CSS属性

    CSS有N多属性,根据继承性,主要可以分为2大类

    可继承属性 
    - 父标签的属性值会传递给子标签 
    - 一般是文字控制属性

    不可继承属性 
    - 父标签的属性值不能传递给子标签 
    - 一般是区块控制属性

    CSS属性-可继承属性

    所有标签可继承 
    visibility、cursor

    内联标签可继承 
    letter-spacing、word-spacing、shite-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction

    块级标签可继承 
    text-indent、text-align

    列表标签 
    list-style、list-style-type、list-style-position、list-style-image

    CSS属性-不可继承属性

    display、margin、border、padding、background 
    height、min-height、max-height、width、min-width、max-width 
    over-flow、position、left、right、top、bottom、z-index 
    float、clear 
    table-layout、vertical-align 
    page-break-after、page-bread-before 
    unicode-bidi

    盒子模型

    网页上每一个标签都是一个盒子 
    每个盒子都有四个属性

    属性 说明
    内容(content) 盒子里装的东西,网页中通常是指文字和图片
    填充(padding,内边距) 怕盒子里装的(贵重的)东西损坏,而添加的泡沫或者其它抗震的辅料
    边框(border) 盒子本身
    边界(margin,外边距) 盒子摆放的时候不能全部堆在一起,盒子之间要留一定空隙保持通风,同时也为了方便取出
    <html>
    <head lang="en">
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            div {
                width: 100px;
                height: 100px;
                background-color: blue;
                margin-top: 20px;
                padding-top: 20px;
                border: 20px solid red;
                border: 5px dashed red;/*虚线*/
                        }
        </style>
    
    </head>
    <body>
        <div>123</div>
        <div>456</div>
    </body>
    </html>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22

    内容(content)属性

    属性 描述
    height 设置元素高度
    max-height 设置元素的最大高度
    max-width 设置元素的最大宽度
    min-height 设置元素的最小高度
    min-width 设置元素的最小宽度
    width 设置元素的宽度

    填充(padding,内边距)属性

    属性 描述
    padding 在一个声明中设置所有内边距属性
    padding-bottom 设置元素的下内边距
    padding-left 设置元素的做内边距
    padding-right 设置元素的有内边距
    padding-top 设置元素的上内边距

    边框border属性

    属性 描述
    border-width 宽度
    border-style 样式
    border-color 颜色
    border-radius 圆角

    边界margin属性

    属性 描述
    margin 在一个声明中设置所有外边距属性
    margin-bottom 设置元素的下外边距
    margin-left 设置元素的左外边距
    margin-right 设置元素的右外边距
    margin-top 设置元素的上外边距
    展开全文
  • HTML5网页开发实例详解

    热门讨论 2014-05-29 17:15:36
    本书分为 14章。...第 6~12章介绍了表单、 Canvas、多媒体、地理、拖放、存储、通信、离线应用等多个方向,并给出了...本书适用于所有前端开发初学者和网页设计入门者,也可作为大中专院校及培训学校教材及上机指导用书。
  • 小程序开发与网页开发的区别

    千次阅读 2019-05-23 09:48:00
    1. 小程序开发和网页开发的关系? 2.小程序开发和各种开发框架之间的关系? 首先讲,小程序和网页开发都依赖javascript,但是所用的javascript有所不同,如下: DOM:文档对象模型 BOM:浏览器对象模型 正...

    开发小程序的时候总会有以下几个疑问:

    1. 小程序开发和网页开发的关系?

    2.小程序开发和各种开发框架之间的关系?

     

    首先讲,小程序和网页开发都依赖javascript,但是所用的javascript有所不同,如下:

    DOM:文档对象模型

    BOM:浏览器对象模型

    正因为小程序没有DOM和BOM对象所以,前端开发非常熟悉的一些库,例如 jQuery、 Zepto 等,在小程序中是无法运行的。

    正因为小程序的框架和NPM与Native的不同,一些 NPM 的包在小程序中也是无法运行的。

    其次,从小程序的运行环境上看

    小程序的主要开发语言是 JavaScript

    ​网页开发渲染线程和脚本线程是互斥的,这也是为什么长时间的脚本运行可能会导致页面失去响应,
    而在小程序中,二者是分开的,分别运行在不同的线程中。

    网页开发者可以使用到各种浏览器暴露出来的 DOM API,进行 DOM 选中和操作。而如上文所述,
    小程序的逻辑层和渲染层是分开的,逻辑层运行在 JSCore 中,并没有一个完整浏览器对象,因而缺少相关的DOM API和BOM API。

     

    转载于:https://www.cnblogs.com/bugutian/p/10910164.html

    展开全文
  • 为了保障整个系统的安全性,在线考试系统实现了分类验证的登录模块,通过此模块,可以对不同身份的登录用户进行验证,确保了不同身份的用户操作系统。在抽取试题上,系统使用随机抽取试题的方式,体现了考试的客观与...
  • 如何快速的开发网页

    千次阅读 2019-06-07 21:49:31
    如何快速的开发网页 开发工具与关键技术:Visual Studio 2015 如何快速的开发网页 作者:李国旭 撰写时间:2019年6月7日 那么我们首先可能会想到用插件,因为插件可以帮助我们快速地开发网页等这些方面的设计,但是...
  • 常用的网页开发工具有哪些

    万次阅读 2011-11-02 10:48:04
    常用的网页开发工具有哪些 制作网页的基本软件离不开HTML,但是如果真的要用其完成全部的网络课程开发是不现实的,因为既不方便效率又低,常用的方法是选择一种工具软件,只是在必要的时候对工具软件生成的...
  • 可视化网页开发工具用哪个好?

    千次阅读 2019-12-28 15:49:50
    前端可视化在很多人看来是有一些难度,不过借助平台工具还是有捷径的。前端攻城狮不用大规模写代码,只需要通过快捷代码来实现即可。为提升开发效率,在线开发提供了大量常用功能代码块,选择所需功能自动生成代码。...
  • 6款实用网页开发和设计工具

    千次阅读 2019-04-03 09:43:17
    此外,随着需求及项目的进一步细化,开发者社区几乎每天都会出现新的库和开发工具,作为网页开发者或设计师的你,自然很有必要去了解和掌握当下最新的、实用的工具,持续优化工作方法、有效提高开发进度。...
  • 网站开发工具选择(asp.net)

    千次阅读 2012-11-13 20:09:15
    开发工具选择 作为商用企业级WEB服务的《公司网站》,必须做到以下几点: 安全稳定性 作为商用企业级WEB服务的服务型网站,不仅要考虑到用户的使用方便,更要格外重视站点的安全和...
  • 企业Java网站开发工具

    千次阅读 2013-04-20 14:58:13
    企业Java网站开发工具 作者:吴梦升 前言 有人说用Java开发网站的速度慢而且在美观上还没有C#好,但我个人认为使用Java开发项目可以做到快速开发和高质量开发,因为Java很多的框架和工具是开源的,而且对于项目...
  • 8小时学会HTML网页开发

    万人学习 2015-03-18 20:46:18
    一说学网页,学编程,大家都下意识觉得要"吃苦","熬夜",哪有那么复杂,一定是你看错了教程. 挑一个阳光的午后,关掉手机,用6个小时,看看十八哥如何把一个公司的保安教会HTML,Div,CSS的. 课程共8小时,57小集,轻松一点,你...
  • 在这篇文章中,我们特别提出了9个免费的工具来支持动态网页开发。许多这些插件从jQuery库,有很多有用的和强大的工具武装的Web开发人员。我们希望你会喜欢这个集合,并发现这些工具对你有用。享受! 1.Gmaps jQuery...
  • 微信公众平台开发网页开发

    万次阅读 2018-07-11 14:28:43
    以前写过一篇《微信公众平台开发的一点收获》,这一篇说说微信公众平台网页开发的知识。微信公众平台应该是国内最大的开放平台,对于技术开发人员来说,不管有没有自己的公众号,应该也要有一定的了解,其实只要有一...
  • HTML5移动端手机网站开发

    万次阅读 2018-06-28 20:19:21
    手写手机网站一般我们自己手动开发手机网站的话,基本可以划分两类来做到。一类是通过在网页头部添加meta标签进行实现(网页指html5的格式来开发)。另一类是通过CSS3的Media标签(媒介查询)来实现。 在这里我们...
  • 我们的开源世界里有很多非常棒的可以完全替代Dreamweaver的各种功能的优秀Web开发工具,更重要的是它们也免费。如果你正在寻找Dreamweaver的替代品,下面这8款软件你应该优先尝试一下。注意,没有先后顺序,并不是第...
  • 2.1 网站开发工具

    2018-01-20 12:41:38
    一、网站开发工具简介 比较好的网页开发工具:Visual Studio、Dreamweaver和Subline Text
  • 网站开发的基本步骤

    千次阅读 2019-03-17 19:45:30
    1.网站策划:网站定位、资料收集、确定开发环境 2.页面设计:效果图、页面开发、整体效果演示 3.后台开发:数据库设计、程序实现、测试与发布 4.网站部署:域名申请、购买服务器、网站部署 5.后期维护:内容维护...
  • 个人网站开发流程

    千次阅读 2019-03-02 11:27:00
    1.确定主题 选择主题应该是小而精,目标定位要小,内容要精。不要去试图制作一个包罗万象的站点,这往往会失去网站的特色,也会带来高强度的劳动,给网站的及时更新带来困难。...3.学习网页设计和开发技术 对于常...

空空如也

1 2 3 4 5 ... 20
收藏数 1,339,796
精华内容 535,918
关键字:

网页开发