html入门 总结

1 HTML入门
    * HTML 指的是超文本标记语言 (Hyper Text Markup Language)
    * 扩展名:*.html 或 *.htm
    * 需要使用浏览器进行解析(查看)
        * HTML源文件通过浏览器进行解析,不需要编译
    * 规范:w3c

2.标签
    * 必须使用<标签名>扩住
        * 开始标签:<标签名称>
        * 结束标签:</标签名称>
        * 标签体:<标签名称> 与 </标签名称> 之间内容
        * 简写,没有标签体:<标签名称 />        -- HTML规范中建议每一个标签应该有结束符,xhtml(与HTML4.01)相似,xhtml必须要求结束符,必须小写等
    * html不区分大小写,建议使用小写。
    * 元素
        * HTML 元素指的是从开始标签到结束标签的所有代码
    * 属性
        * 属性为 HTML 元素提供附加信息
            * 属性总是以名称/值对的形式出现,比如:name="value"。
            * 属性总是在 HTML 元素的开始标签中规定
        * 格式:
            <标签名 属性名='属性值'> 数据内容 </标签名>
            <标签名 属性名='属性值' />
        * 注意:属性值建议使用引号扩住(单引号或双引号),如果不使用引号也可以,但不规范。(xhtml必须使用引号)

3.标签
    * 1 常用
        * 注释:<!-- 注释内容 -->
        * 回车换行:<br />
        * 水平线:<hr/>

    * 2  文字标签:font 用于显示文字
            属性:color="颜色"  设置文字的颜色
                1、值可以是 颜色的名称如:red blue yellow green
                2、值也可以用16进制数字表示如 #ff0000  红绿兰 三元色
            size="3" 设置文字的大小
                值:1-7之间的整数
            face="黑体" 设置文字的字体
        h1到h6 ,显示效果越来越小,标题将自动换行
    * 3  color属性:用于确定字体颜色
        * 固定单词:red、green、blue等(不建议)
        * 十六进制三元素(红、绿、蓝):#FFFFFF。使用两位十六进制表示255
            * 红:#FF0000
            * 绿:#00FF00
            * 蓝:#0000FF
            * 白:#FFFFFF
            * 黑:#000000
            * 灰:#999999
        * 十进制三元素函数:rgb(r,g,b) ,取值:0-255
            * size 设置字体大小,取值:1-7
    * 4 实体格式:&实体名称;
        * &nbsp; 空格
        * &lt; 小于号
        * &gt; 大于号
        * &amp;    &符号本身
        * &copy;版权 ?
        * &reg; 注册商标?
        * 实体分名称和编号,所有的浏览器都支持标号,但不一定支持名称。
    * 5 列表分类:
        * 有序列表:<ol>
            * type属性,设置显示类型,取值:A、a、I、i、1
        * 无序列表: <ul>
            * type属性:设置显示图标,取值:disc 实心圆  、square 实心方块 、circle 空心圆
        * 使用<li>添加列表项
    * 6 <img>将制定的图片显示到浏览器端
        * src 属性:图片的路径,URL 统一资源定位符 , URI 统一资源标示符
        * alt 属性:图片不存在时提示信息
    * 7 <map> 在已有的图像基础上,给图像局部添加相应的链接。需要与<img>标签结合使用
        * 通过<area>标签确定图片局部位置
            * shape="",局部位置的形状     rect矩形、 circle圆、 poly多边
            * coords="" 局部位置的坐标
            * href="" 链接
        * 区域格式
            * 圆形:shape="circle",coords="x,y,z"
            * 多边形:shape="polygon",coords="x1,y1,x2,y2,x3,y3,..."
            * 矩形:shape="rectangle",coords="x1,y1,x2,y2"
        * 必须在<img> 提供usemap属性,与<map>标签结合
    * 8 a标签,超链接,访问指定的页面 【★★★】
        * 标签体:浏览器显示的内容
        * href属性(attribute) : 用于指定需要访问的页面的路径或页面特定位置
        * name属性:给链接进行名称,用于通过href进行访问
        * target属性:在何处打开目标 URL
            _blank:以新窗口单开指定页面。
            _self: 当前窗口
            _parent:载入当前窗口的父窗口。
            _top:整个浏览器窗口。
            framename : 自定义框架名称
    * 9<table>标签,html用于定义表格,【★★★】
        * html布局: table布局,div+css布局,框架布局(frameset/iframe)
        * 子标签:<tr>行 <td>列
        * 属性
            * border属性:规定表格边框的宽度。
            * cellpadding 属性: 规定单元边沿与其内容之间的空白。 STF
            * cellspacing 属性: 规定单元格之间的空白。
            * colspan :将指定的列合并成一个单元格
            * rowspan :将指定的行合并成一个单元格
    * 10 <frameset> 定义框架,将多个页面整合在一起,仅仅会规定在框架集中存在多少列或多少行【★】
            * 如果使用<frameset>标签,将不能使用<body>
            * rows属性:用于确定多行比例
                * 可以使用百分比:20%,30,50%
                * 可以使用像素:200px,100px,300px
                * 还可以使用星号(*):20%,*        //表示剩余的所有
            * cols属性:用于确定多列比例
            * scrolling="no" ,取消滚动条
            * noresize="noresize" ,禁止改变位置
            * 子标签<frame> 用于确定页面
                * src属性:确定页面的位置
      * <iframe>
    * 11 表单是一个包含表单元素的区域,<form>表单,标签体中添加表单元素。目的:将表单元素的内容提交到指定位置【★★★】
        * action属性:用于确定表单提交的位置,URL
        * method属性:提交方式,取值:post、get
        * 表单元素
            * <input> 标签:用户输入标签,
                * type属性,用于确定浏览器显示输入标签的类型
                    text 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。
                    password 定义密码字段。该字段中的字符被掩码。
                    hidden 定义隐藏的输入字段。
                    radio 定义单选按钮。
                    checkbox 定义复选框。
                    submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
                    reset 定义重置按钮。重置按钮将恢复表单中的所有元素的默认数据。
                    file 定义输入字段和 "浏览"按钮,供文件上传。
                    button 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。
                * 注意:表单元素,如果需要提交数据,必须提供name属性
                * 其他属性
                    checked :元素首次加载时应当被选中。
                    disabled :元素加载时禁用此元素。
                    readonly :输入字段为只读。
            * <select> 选择框
                * 需要提供name属性
                * <optgroup>选项进行分组
                * 子标签 <option>单个选项,需要提供value值
                * 属性multiple="multiple" size="20",将选择框修改成多选,默认情况是单选
    * 12 头标签
        <base>用于确认当前页面,所有的使用相对路径的默认基路径
        <title> 整个网页标题
        <link> 引用一个css样式文件【★★★】
            rel属性:“stylesheet”引用的是样式表
            type属性:MIME类型。格式:大类型/小类型 ,例如:text/css 、text/html 、 text/javascript 、image/jpeg等
            href属性:确定css文件位置URL
        <style type="text/css"> 在标签体中确认,当前页面中使用CSS样式【★★★】
        <script type="text/javascript"> 在当前页面中,应用javascript代码【★★★】
        <meta> 当前页面中确定页面的元数据。添加HTTP协议的头信息(模拟)
            http-equiv 属性:编写http头
            content 属性:每一个头表示的内容
            例如:
                key ##  Content-Type ,文档类型,文档编码
                value ##  text/html;charset=UTF-8
                
                key ## refresh ,刷新
                value
                    格式1:秒数
                    格式2:秒数;url=路径   若干秒后跳转到指定的页面
作业:
    * 编写登录页面,提交到一个框架(三部分:顶、左、中)
    * 温习java基础
        * java面向对象
        * 集合操作(List/Map)
        * IO (中文内容读写)
        * 反射(类、构造、字段、方法)
















1 HTML入门
    * HTML 指的是超文本标记语言 (Hyper Text Markup Language)
    * 扩展名:*.html 或 *.htm
    * 需要使用浏览器进行解析(查看)
        * HTML源文件通过浏览器进行解析,不需要编译
    * 规范:w3c

2.标签
    * 必须使用<标签名>扩住
        * 开始标签:<标签名称>
        * 结束标签:</标签名称>
        * 标签体:<标签名称> 与 </标签名称> 之间内容
        * 简写,没有标签体:<标签名称 />        -- HTML规范中建议每一个标签应该有结束符,xhtml(与HTML4.01)相似,xhtml必须要求结束符,必须小写等
    * html不区分大小写,建议使用小写。
    * 元素
        * HTML 元素指的是从开始标签到结束标签的所有代码
    * 属性
        * 属性为 HTML 元素提供附加信息
            * 属性总是以名称/值对的形式出现,比如:name="value"。
            * 属性总是在 HTML 元素的开始标签中规定
        * 格式:
            <标签名 属性名='属性值'> 数据内容 </标签名>
            <标签名 属性名='属性值' />
        * 注意:属性值建议使用引号扩住(单引号或双引号),如果不使用引号也可以,但不规范。(xhtml必须使用引号)

3.标签
    * 1 常用
        * 注释:<!-- 注释内容 -->
        * 回车换行:<br />
        * 水平线:<hr/>

    * 2  文字标签:font 用于显示文字
            属性:color="颜色"  设置文字的颜色
                1、值可以是 颜色的名称如:red blue yellow green
                2、值也可以用16进制数字表示如 #ff0000  红绿兰 三元色
            size="3" 设置文字的大小
                值:1-7之间的整数
            face="黑体" 设置文字的字体
        h1到h6 ,显示效果越来越小,标题将自动换行
    * 3  color属性:用于确定字体颜色
        * 固定单词:red、green、blue等(不建议)
        * 十六进制三元素(红、绿、蓝):#FFFFFF。使用两位十六进制表示255
            * 红:#FF0000
            * 绿:#00FF00
            * 蓝:#0000FF
            * 白:#FFFFFF
            * 黑:#000000
            * 灰:#999999
        * 十进制三元素函数:rgb(r,g,b) ,取值:0-255
            * size 设置字体大小,取值:1-7
    * 4 实体格式:&实体名称;
        * &nbsp; 空格
        * &lt; 小于号
        * &gt; 大于号
        * &amp;    &符号本身
        * &copy;版权 ?
        * &reg; 注册商标?
        * 实体分名称和编号,所有的浏览器都支持标号,但不一定支持名称。
    * 5 列表分类:
        * 有序列表:<ol>
            * type属性,设置显示类型,取值:A、a、I、i、1
        * 无序列表: <ul>
            * type属性:设置显示图标,取值:disc 实心圆  、square 实心方块 、circle 空心圆
        * 使用<li>添加列表项
    * 6 <img>将制定的图片显示到浏览器端
        * src 属性:图片的路径,URL 统一资源定位符 , URI 统一资源标示符
        * alt 属性:图片不存在时提示信息
    * 7 <map> 在已有的图像基础上,给图像局部添加相应的链接。需要与<img>标签结合使用
        * 通过<area>标签确定图片局部位置
            * shape="",局部位置的形状     rect矩形、 circle圆、 poly多边
            * coords="" 局部位置的坐标
            * href="" 链接
        * 区域格式
            * 圆形:shape="circle",coords="x,y,z"
            * 多边形:shape="polygon",coords="x1,y1,x2,y2,x3,y3,..."
            * 矩形:shape="rectangle",coords="x1,y1,x2,y2"
        * 必须在<img> 提供usemap属性,与<map>标签结合
    * 8 a标签,超链接,访问指定的页面 【★★★】
        * 标签体:浏览器显示的内容
        * href属性(attribute) : 用于指定需要访问的页面的路径或页面特定位置
        * name属性:给链接进行名称,用于通过href进行访问
        * target属性:在何处打开目标 URL
            _blank:以新窗口单开指定页面。
            _self: 当前窗口
            _parent:载入当前窗口的父窗口。
            _top:整个浏览器窗口。
            framename : 自定义框架名称
    * 9<table>标签,html用于定义表格,【★★★】
        * html布局: table布局,div+css布局,框架布局(frameset/iframe)
        * 子标签:<tr>行 <td>列
        * 属性
            * border属性:规定表格边框的宽度。
            * cellpadding 属性: 规定单元边沿与其内容之间的空白。 STF
            * cellspacing 属性: 规定单元格之间的空白。
            * colspan :将指定的列合并成一个单元格
            * rowspan :将指定的行合并成一个单元格
    * 10 <frameset> 定义框架,将多个页面整合在一起,仅仅会规定在框架集中存在多少列或多少行【★】
            * 如果使用<frameset>标签,将不能使用<body>
            * rows属性:用于确定多行比例
                * 可以使用百分比:20%,30,50%
                * 可以使用像素:200px,100px,300px
                * 还可以使用星号(*):20%,*        //表示剩余的所有
            * cols属性:用于确定多列比例
            * scrolling="no" ,取消滚动条
            * noresize="noresize" ,禁止改变位置
            * 子标签<frame> 用于确定页面
                * src属性:确定页面的位置
      * <iframe>
    * 11 表单是一个包含表单元素的区域,<form>表单,标签体中添加表单元素。目的:将表单元素的内容提交到指定位置【★★★】
        * action属性:用于确定表单提交的位置,URL
        * method属性:提交方式,取值:post、get
        * 表单元素
            * <input> 标签:用户输入标签,
                * type属性,用于确定浏览器显示输入标签的类型
                    text 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。
                    password 定义密码字段。该字段中的字符被掩码。
                    hidden 定义隐藏的输入字段。
                    radio 定义单选按钮。
                    checkbox 定义复选框。
                    submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
                    reset 定义重置按钮。重置按钮将恢复表单中的所有元素的默认数据。
                    file 定义输入字段和 "浏览"按钮,供文件上传。
                    button 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。
                * 注意:表单元素,如果需要提交数据,必须提供name属性
                * 其他属性
                    checked :元素首次加载时应当被选中。
                    disabled :元素加载时禁用此元素。
                    readonly :输入字段为只读。
            * <select> 选择框
                * 需要提供name属性
                * <optgroup>选项进行分组
                * 子标签 <option>单个选项,需要提供value值
                * 属性multiple="multiple" size="20",将选择框修改成多选,默认情况是单选
    * 12 头标签
        <base>用于确认当前页面,所有的使用相对路径的默认基路径
        <title> 整个网页标题
        <link> 引用一个css样式文件【★★★】
            rel属性:“stylesheet”引用的是样式表
            type属性:MIME类型。格式:大类型/小类型 ,例如:text/css 、text/html 、 text/javascript 、image/jpeg等
            href属性:确定css文件位置URL
        <style type="text/css"> 在标签体中确认,当前页面中使用CSS样式【★★★】
        <script type="text/javascript"> 在当前页面中,应用javascript代码【★★★】
        <meta> 当前页面中确定页面的元数据。添加HTTP协议的头信息(模拟)
            http-equiv 属性:编写http头
            content 属性:每一个头表示的内容
            例如:
                key ##  Content-Type ,文档类型,文档编码
                value ##  text/html;charset=UTF-8
                
                key ## refresh ,刷新
                value
                    格式1:秒数
                    格式2:秒数;url=路径   若干秒后跳转到指定的页面














































评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值