输入banner图图片脚本导航/分类

PHP笔记(HTML篇),php笔记html_PHP教程

PHP笔记(HTML篇),php笔记html


学过很多语言,最近终于决定要学PHP了。

学习PHP,首先总要学习HTML,那么,我也从HTML开始吧!

首先学习任何编程语言,看再多书,都离不开它——帮助文档

HTML帮助文档:http://pan.baidu.com/s/1hqxOymo

不说不知道,近年来比较火的HTML5,是HTML的一个发展方向,HTML的发展方向如下图,一边是多元化的HTML5,另一边是规范化的XML,过程中还衍生了XHTML!

做网页,总避免不了要使用颜色,颜色有两种表示法,单词表示法和十六进制表示法,其中,十六进制表示法表示的颜色比较全,我也整理了一篇博文,以供查看。

RGB颜色表:http://blog.csdn.net/u010849590/article/details/43339473

编程语言总有一些特殊符号不能直接作为文本显示,HTML也不例外,这些特殊符号在HTML中称为实体,博主也整理了一篇HTML实体对照表,供不时之需。

实体对照表:http://blog.csdn.net/u010849590/article/details/43380181

网页代码是由浏览器直接解析的,编写网页必须选择一种编码,常用的编码有UTF-8、GBK、GD2312等,而浏览器也可以选择一种编码去解析网页。那么,问题来了,如果浏览器选择的编码和编写网页的编码不一致怎么办?解决的办法有是三个:

很明显,一种编码不能适合所有人,而让用户修改浏览器编码也不够智能,所以,前两种都是治标不治本,第三种方法才是王道。

是单标签,其用法是

以UTF-8为例:

标签的其他用法,可查看帮助文档。

标签可设置超链接,如将相对路径装换为绝对路径、打开方式等。是单标签,其具体用法可参考帮助文档。

的属性设置会默认为整个网页的默认设置,可设置字体颜色(text)、背景颜色(bgcolor)、背景图片(background)、背景属性(bgproperties)等,还是查看帮助文档!

是段落标签,这个标签比较特殊,既可用作单标签也可用作双标签。用作双标签时,标签之间的内容作为一段显示;作为单标签时,从标签处开始换行。双标签的用法比较标准,也比较普遍。

标签是双标签,标签内的文本会按照原格式
输出,与不同,<pre class="brush:php;toolbar:false">标签内的标签是可以被解析的,而<xmp>内的标签是不能解析,以文本形式</pre>输出的!</span></p> <p> </p> <p><span class="Apple-style-span"><li>标签搭配<ol>和<ul>使用,<li><span class="Apple-style-span">为列表(list)标签,是双标签,标签间的内容作为列表中的一项显示,默认无序;<ol>标签搭配<li>标签,使列表变为有序列表;<ul>标签搭配<li>使用,作为无序列表组。这些标签的属性可查看帮助文档。</span></span></p> <p> </p> <p><span class="Apple-style-span"><sub>和<sup>,下标标签和上标标签,均为双标签。</span></p> <p> </p> <p><span class="Apple-style-span"><img>叫做图像标签,用于显示图片,为单标签,src属性设置图片链接,title属性设置鼠标放在上面时显示的名称,alt属性设置图片加载失败显示的名称。其他属性可查帮助文档。</span></p> <p> </p> <p><span class="Apple-style-span">是链接标签,用于超链接,为双标签。href属性设置链接地址,title属性设置标签放在上面时显示的名称,target属性设置打开链接的方式,其他属性,可查看帮助文档<span class="Apple-style-span">。</span></span></p> <p><span class="Apple-style-span">标签设置锚点,用于链接到特定区域,用name属性。<span class="Apple-style-span">name设置一个名称,<span class="Apple-style-span">href属性设置为"#<span class="Apple-style-span">"+<span class="Apple-style-span">name的名称,即可链接到本页name所在处;若href设置为网页路径+"#"+name的名称,则可链接到该网页的name所在处;herf属性设置为"#"或为空时,跳转到本页头。</span></span></span></span></span></p> <p><span class="Apple-style-span"><img><span class="Apple-style-span"><span class="Apple-style-span">当前页跳转</span></span></p> <p><img src="http://img.blog.csdn.net/20150205000000815?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></p> <p><span class="Apple-style-span"><span class="Apple-style-span">跳转到其他页面</span></span></p> <p> </p> <p><span class="Apple-style-span"><span class="Apple-style-span">URL:统一资源定位符</span></span></p> <p><span class="Apple-style-span"><span class="Apple-style-span">URL组成:以http://i.cnblogs.com/EditPosts.aspx?postid=4275104&update=1为例</span></span></p> <ul> <li>协议名称:http://、ftp://、https://、file://等(http://)</li> <li>主机名:(i.cnblogs.com)(cnblogs.com是域名)</li> <li>端口号:80、8080、等(范围:0~65535)(80)</li> <li>资源名称:访问的文件(EditPosts.aspx)</li> <li>参数:"?"后面的键值对,多个参数用"&"连接(get传参,参数可见;post传参,参数不可见)(postid=4275104&update=1)</li> </ul> <p> </p> <p><span>URL的相对路径:</span></p> <ul> <li><span>./:代表本地路径</span></li> <li><span>../:代表上级路径</span></li> <li><span>../../:代表上上级路径(以此类推)</span></li> </ul> <p> </p> <p><span><table>标签用于构建表格,为双标签。width属性设置表格的宽度,heigth属性设置表格的高度,border属性设置表格的边框,cellspacing属性设置单元格之间的宽度,cellpadding属性设置单元格内容与边框之间的距离。</span></p> <p><span><tr>标签嵌套<table>标签使用,用于设计表格的行,为双标签。</span></p> <p><span><td>标签嵌套<tr>标签使用,用于表示表格的单元格,为双标签。rowspan属性设置跨行,属性值表示跨越的行数;colspan属性设置跨列,属性值表示跨越的列数。</span></p> <p><span><th>标签嵌套<tr>标签使用,用于表示表格的表头,单元格的内容字体加粗、居中。</span></p> <p><span>更多属性可查帮助文档。</span></p> <p> <img src="http://img.blog.csdn.net/20150207010615583?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></p> <p> </p> <p>HTML的框架(frame),也称为分帧,即将多个页面组合成一个页面显示。</p> <ul> <li>优点: <ul> <li>重载页面时,不需要重载整个页面,增加了网页下载的速度</li> <li>方便制作导航栏</li> </ul> </li> <li>缺点: <ul> <li>多个页面,不易管理</li> <li>代码复杂,无法被搜索引擎索引到</li> <li>多框架的页面会增加服务器的http请求</li> <li>小型的移动设备无法完全显示</li> </ul> </li> <li>由于以上缺点,不符合标准网页设计理念,已被抛弃,但后台可以使用,所以,还是要学习。</li> </ul> <p>框架的标签:</p> <ul> <li><frameset>标签,双标签 <ul> <li><frameset>标签代替了<body>标签,定义框架页面,所以使用<frameset>标签就不用<body>标签</li> <li>border属性设置框架边框的大小</li> <li>rows属性设置框架的行数及高度,需要多少行就编写多少行的大小,&ldquo;*&rdquo;表示剩余空间,用&ldquo;,&rdquo;隔开</li> <li>cols属性设置框架的列数及宽度,需要多少列就编写多少列的大小,&ldquo;*&rdquo;表示剩余空间,用&ldquo;,&rdquo;隔开</li> <li><frameset>可嵌套使用,使框架格式多元化</li> </ul> </li> <li><frame>标签,双标签 <ul> <li>用于显示每个页面的内容,嵌套在<frameset>中使用;</li> <li>src属性设置页面的路径,以显示其内容</li> <li>name属性可设置frame的名称,供链接显示</li> <li>标签的target属性可指定显示页面的frame</li> <li>标签的target属性设置为&ldquo;_parent&rdquo;时,表示它的上一级框架显示,设置为&ldquo;_top&rdquo;时,表示顶级框架显示,及整个网页</li> </ul> </li> </ul> <img src="file:///C:\Users\Administrator\AppData\Roaming\Tencent\Users\952433622\QQ\WinTemp\RichOle\WNYRJ8$}7`39%XA7F`O$ECY.jpg" alt="" /><br /><img src="http://img.blog.csdn.net/20150209002149214?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /> <span>布局显示</span> <span><img src="http://img.blog.csdn.net/20150209002743821?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></span> <span>超链接</span> <ul> <li><span><noframes>标签,双标签</span> <ul> <li><span>当浏览器无法加载框架的时候,会显示<noframes>标签内的内容</span></li> <li><span>嵌套在<frameset>标签中使用,搭配<body>标签使用</span></li> </ul> </li> <li><span><img><img src="http://img.blog.csdn.net/20150209225828597?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></p> <p>关于框架的其他属性和用法,可查看帮助文档!</p> <p> </p> <p>表单:可以把输入的数据传送到服务器端的程序的html元素</p> <ul> <li><form>标签,双标签 <ul> <li>表示HTML表单</li> <li>action属性设置数据传送的目的地</li> <li>method属性设置传输方式,可设置为get和post <ul> <li>get传输的信息较少,速度较快,提交信息会显示在地址栏,不安全</li> <li>post传输的信息较多,速度较慢,提交信息不会显示在地址栏,较安全</li> </ul> </li> <li>enctype属性设置数据发送到服务器的编码类型 <ul> <li>application/x-www-form-urlencoded:窗体数据被编码为名称/值对,为标准编码格式,默认值</li> <li>multipart/form-data:窗体数据被编码为一条信息,页面上的每个控件对应信息中的一部分,上传文件时使用</li> </ul> </li> </ul> </li> </ul> <p><img src="http://img.blog.csdn.net/20150209234024931?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></p> <ul> <li><input>标签,单标签 <ul> <li>type,代表一个输入域的显示方式(分为输入型、选择型、点击型) <ul> <li>text,单行文本输入域,输入型</li> <li>password,密码输入域,输入的字符显示为"*",输入型</li> <li>file,文件上传,输入型</li> <li>checkbox,复选框,选择型</li> <li>radio,单选框,选择型</li> <li>hidden,隐藏域,一般用于传递默认值, </li> <li>button,按钮,点击不会提交表单,可进行其他操作,点击型</li> <li>image,图片按钮,点击会提交表单,点击型</li> <li>submit,提交按钮,点击可提交表单,点击型</li> <li>reset,重置按钮,点击型</li> </ul> </li> <li>name,表单项的名称 <ul> <li>通常设置为与数据库中相对应的字段名相同</li> <li>点击型不需要该属性</li> <li>传输数据时的标识符</li> <li>复选框的name值一般使用数组表示</li> <li>单选框的name值相同时,选项相互排斥</li> </ul> </li> <li>value,表单项的值 <ul> <li>选择型设置该属性值,选择后,可随表单传输</li> <li>点击型除image,设置该属性,即设置按钮显示名称</li> <li>输入型设置该属性值,设置默认value值</li> </ul> </li> <li>maxlength,限制文本输入长度</li> </ul> </li> <li><textarea>标签,双标签 <ul> <li>多行文本域,可输入多行文本</li> <li>cols,设置列数,通过列数,设置宽度</li> <li>rows,设置行数,通过行数,设置高度</li> <li>其余属性与<input>标签输入型一致</li> </ul> </li> <li><select>标签,双标签 <ul> <li>下拉菜单</li> <li>name属性设置表单项名称,通常与数据库字段名一致</li> <li>multiple属性设置表单为多选</li> </ul> </li> <li><option>标签,双标签 <ul> <li>嵌套在<select>标签中使用,表示下拉菜单的一个选项</li> <li>value属性设置选项的值,选择后,随表单传输</li> <li>selected属性设置默认被选中</li> </ul> </li> <li><lable>标签可设定文本与选项绑定,达到点击文本即可选择的作用</li> </ul> <p><img src="http://img.blog.csdn.net/20150211000412100?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDg0OTU5MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" /></p> <p>关于表单的其他属性和用法,可查看帮助文档!</p> <p>标签,双标签</p> <ul> <li>图层标签,用于定位元素或布局</li> <li>层中的内容可放到浏览器任意位置,可放入HTML元素</li> <li>常与CSS结合使用</li> </ul> <p>由于常与CSS结合使用,在学习CSS时再深入学习!</p> <p> </p> <p><span>至此,HTML的基本元素已经学完了,可以开始制作简单的静态网页了,但是离动态网站还远着呢!接着来学CSS吧!</span></p> <img src="file:///C:\Users\Administrator\AppData\Roaming\Tencent\Users\952433622\QQ\WinTemp\RichOle\WNYRJ8$}7`39%XA7F`O$ECY.jpg" alt="" /></p> <p align="left"><span id="url" itemprop="url">http://www.bkjia.com/PHPjc/956929.html</span><span id="indexUrl" itemprop="indexUrl">www.bkjia.com</span><span id="isOriginal" itemprop="isOriginal">true</span><span id="isBasedOnUrl" itemprop="isBasedOnUrl">http://www.bkjia.com/PHPjc/956929.html</span><span id="genre" itemprop="genre">TechArticle</span><span id="description" itemprop="description">PHP笔记(HTML篇),php笔记html 学过很多语言,最近终于决定要学PHP了。 学习PHP,首先总要学习HTML,那么,我也从HTML开始吧! 首先学习任何...</span></p> </div> </div> <script type="text/javascript" src="/layui/layui.js"></script> <script> layui.use('code', function(){ layui.code({ elem: 'pre', //默认值为.layui-code about:false, title:'PHP笔记(HTML篇),php笔记html_PHP教程代码块', encode: true //是否转义html标签。默认不开启 }); }); </script> <footer class="comm-footer"> <ul class="channels"> <li> <a target="_top" href="/system/">操作系统</a> </li><li> <a target="_top" href="/down/">程序下载</a> </li><li> <a target="_top" href="/jquery/">jquery插件库</a> </li><li> <a target="_top" href="/jiaoben/">编程</a> </li><li> <a target="_top" href="/db/">数据库</a> </li><li> <a target="_top" href="/tools/">在线工具</a> </li><li> <a target="_top" href="/framebook/">框架书籍</a> </li><li> <a target="_top" href="/xitongjiaocheng/">系统教程</a> </li><li> <a target="_top" href="/ruanjianxiazai/">软件下载</a> </li> </ul> <ul class="versions"> <li> <a href="https://m.gxlcms.com" class="active">触屏版</a> </li> <li> <a href="https://www.gxlcms.com" target="_top">电脑版</a> </li> </ul> <p><a href="https://beian.miit.gov.cn/" target="_blank" style="color:#ffffff"></a><script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6c9b8cea1903c9f813f150c04aeebc3c"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script></p> </footer> </body> </html>