A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© zjj5669436182 中级黑马   /  2018-1-5 21:43  /  2135 人查看  /  5 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

学习和了解web前端的学习,学习前端主要是利于我们以后再编写程序,处理数据能够更流畅也方便自己的调试
01-HTML:
    概念:超文本标记语言
    作用:用于静态页面的制作
   
02-HTML的基本语法:
    1.HTML文件以.html或者.htm结尾
   
    2.HTML的结构标签
        跟标签:<html>
        头标签:<head>
        体标签:<body>
   
    3.HTML的页面标题
        <title>页面标题</title>
   
    4.HTML的排版标签
        标题标签:<h1> 【范围h1 - h6】  heading
        段落标签:<p>                     paragraph
        居中标签:<center>
        
    5.字体相关的标签
        a.HTML的字体标签
        <font>文字</font>
        属性:
            color=颜色
            size=字体大小【默认是3,范围1-7】
        例子:
            <font color="red" size="4">

        b.字体粗,斜,下划线标签
            粗体标签:<b>        【bold】
            斜体标签:<i>         【Italic】
            下划线标签:<u>        【Underline】
    6.其他标签
        <hr/>:横线
        <pre>:原生标签
        HTML的标签不区分大小写,但是推荐小写。
        HTML的属性可以不加双引号,但是推荐加。
        如何查看标签单词缩写:HTML中的<ol>是什么单词的缩写
        
        
    7.资源标签
        <img>  :图片     【属性:src=来源,width=x宽像素(%百分比),height=x高像素(%百分比),alt=提示】
        <video>:视频     【属性:controls=显示播放器】
       <audio>:背景音乐 【属性:autoplay=自动播放,loop=循环播放】
        
   
    8.列表标签
        有序标签:<ol><li>11111</li>    【ol:order list】
                      <li>22222</li>    【li: list item 】
                  </ol>                    【属性:type=显示样式】
                  
        无序标签:<ul>                    【ul:unorder list】
                    <li>11111</li>        
                    <li>22222</li>
                  </ul>
   
    *9.超链接标签
        <a>:点击打开网页 【属性:href=网页路径,target=(_bank-新窗口打开,_self-在自身页面打开,_parent-在父窗口中打开)】
   
    *10.表格标签
       <table>      【border=边框大小 align=(left,right,center-表格水平位置),width宽,height高,bgcolor=背景颜色 cellspacing=设置表单距离】
            <tr>         【tr:table row(表格行),align=(left,right,center-tr的内容)】
                <td>         【tr:table data(表格数据),colspan=占几列,rowspan=占几行,align=(left,right,center-td的内容)】
        
        【注:如果要固定表格高度必须在table设置总高度,tr设置每行高度,
              如果table高度比tr加起来大,这tr按照比例分配,否则以tr高度为准】
              
        
****11.表单标签
       <form>        【action=提交路径,method=请求方式(POST/GET)】
            表单元素:

                <input type="text">     :文本框      【name=数据,value=默认值,size=框长度,maxlength=输入长度 readonly=只读】
                <textarea>                :文本域      【name=数据,cols=宽,rows=高
                <input type="password"> :密码框
                <input type="radio">    :单选框      【name=所属单选的name值一致,value=选项,checked=选中】
                <select>                :下拉列表     【name=数据】 【multiple=显示所有数据】
                    <option>            :下拉选项   【value=选项 selected=选中】
                <input type="checkbox">    :多选框      【name=所属多选的name值一致,value=选项,checked=选中】
                <input type="button">    :普通按钮     【value=按钮名称】
                <input type="sumbit">    :提交按钮
                <input type="reset">    :重置按钮
                <input type="file">        :上传文件     【name=数据】   
                <input type="image">    :图片按钮
                <input type="hidden">    :隐藏字段

                了解HTML5的特有标签
                <input type="email">
                <input type="number">
                <input type="date">
                <input type="color">
               
    *12.框架标签(后台页面 注:body标签冲突)
        <frameset>        【cols(纵切)="50%,*",rows(横切)="15%,50%,*"】
            <frame>        【src=内容页面,name=用于target指定跳转页面】     


            
   
03-如何区分HTML4和HTML5?
    HTML4的声明文档:<!DOCTYPE html PUBLIC ...4.01//EN...>
    HTML5的声明文档:<!DOCTYPE html>

04-文件路径问题:
    当前路径:./文件名or文件名
    上一级路径:../文件名
    下一级路径:文件夹/文件名
   
05-POST/GET请求的区别:
    GET:   会将提交的数据显示在地址栏,  有大小限制。
    POST:不会将提交的数据显示在地址栏,没有大小限制。

06-HTML的特殊
    &nbsp;  空格
    &gt;     大于
    &lt;    小于
   其中重点记忆表单标签的作用   
   

5 个回复

正序浏览
温故而知新   加油  
回复 使用道具 举报
日志越来越有水准了!
回复 使用道具 举报
不错哦~6666666
回复 使用道具 举报
回复 使用道具 举报
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马