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

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 顾大圣 初级黑马   /  2018-1-17 15:46  /  921 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

又是一段很帅的总结

  • HTML   Hyper Text Markup Language  超文本标记语言
    • 标记语言:指的是通过 一组标签的形式描述事物的一门语言
    • 超文本 : 比普通的文件更强大
以HMTL结尾的文件 或者HTM的文件

  • 文件标签
声明当前网页为html页面

    <head></head>

     <body></body>

head:用来存放当当前页面的重要信息,一般不展示在HTML页面上

常见的子标签

  <mata charset="UTF-8"> 设计编码格式

           <title>标题</title> 页面的标题

body:要展示在数据放在body中

  • 标题标签
<hn></hn>

n取值  1-6

h1最大        h6最小

自动换行 且留白 默认加粗

常用属性:

align:对齐方式

left:        左  rigth右  center:居中

格式:

<h2 align="center">内容</h2>

3.字体标签

<font></font>

常用属性:

face:字体

size :  尺寸

color:  颜色

<br/>换行

颜色的取值:(RGB)

方式1 #xxxx   x为16进制

方式2  英文单词


其它标签

<p></p>段落标签

<pre标签> 原生标签

<b></b> <strong></strong>加粗

<i></i> 斜体

水平线

<hr/>

换行标签

<br/>

图片标签

<img/>

常用属性

src:l图片的路径

alt:替代文字

title:移动上去显示的文字

width:宽

height:高

路径的写法:相对路径 :./或者 什么都不写, 当前目录

../上级目录

    绝对路径

带协议的绝对路径:


列表标签

<ol></ol>有序   

属性  <type="">   <start> 只针对数字有效 值

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/e8a8a08fe90b4077a15f9d732bd65568/clipboard.png

<ul></ul>无序

常用的标签

<li></li>列表项

超链接

<a></a>

常用属性:

href: 跳转路径

target:在那里打开

   默认值_ self        _blank(在新的标签打开)

表格标签

<table></table>   

常用的子标签

<tr>行

常用子标签

<td>:列

注意一行必只有一个单元格或者一列

Width 表格宽度

Height 表格高度

boder 边框



C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/c6df5481374143748d361401318d02f0/clipboard.png

   


C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/6cb36a8971dd4a21a7834a83bf0f337f/clipboard.png

表单标签

<form></form>

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/359873f6d4764b988ca66518933227c7/clipboard.png

HTML中表单元素:

* <input type=”text”>    :文本框.

    * 常用属性:

       * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :文本框的默认值.

        * size   :文本框的长度.

        * maxlength:文本框输入的最大长度.

        * readonly:只读文本框.

* <input type=”password”>  :密码框.

    * 常用属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :密码框的默认值.

        * size   :密码框的长度.

        * maxlength:密码框输入的最大长度.



* <input type=”radio”>     :单选按钮.

    * 常用的属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :单选按钮的默认值.

        * checked:单选按钮默认被选中.


* <input type=”checkbox”>  :复选按钮.

* 常用的属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :单选按钮的默认值.

        * checked:单选按钮默认被选中.

* <input type=”submit”>    :提交按钮.

* <select>                  :下拉列表.

<option><option>

* <textarea>               :文本域.

属性 rows 长度    cols宽     readonly指定文本为只读readonly



*  <input type=”button”>    :普通按钮.没有任何功能的按钮.


* <input type=”reset”>     :重置按钮.

* <input type=”file”>      :文件上传的表单项.

* <input type=”hidden”>    :隐藏字段.

* <input type=”image”>     :图片按钮



  get:1数据都展示到地址栏

2有大小限制

3get方式是在请求行中

post:

1.数据不会展示在地址栏中

2.数据没有大小限制

3post的数据是在请

<HTML>的框架标签
框架标签<frameset>
属性:
*rows
*cols
使用<frame>标签 frame代表切分的每个部分
DIV
<div><div>独占一行
<span><span> 默认在同一行
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/7f9912ad073346f8990c0376cd0238aa/clipboard.png
所有标签都有style属性   
color 颜色   font-size 字体大小
行内样式 :直接在HTML元素上使用style 属性设置属性
页面样式 :在HTML的<head>标签使用<style>标签设置css
外面样式 :单独定义一个.css的文件,    <link> hreaf=""  style="" type="text/css"  rel=""


元素选择器: 会将所有的DIV选中
        div{
border : 1px solid blue
width 40px
height 15px
}
ID选择器
#标签名                                        元素选择器<类选择器<ID选择器
类选择器
.类名
根据设置标签的class属性
float浮动
属性选择器
input[type="text"]
后代选择器
div > span找这个div中的第一层级的span元素.
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/a687d0a2ce5a4a758ba9ebebe8099fd0/clipboard.png

margin  -----外边距 -- 用来设置该元素距离其它元素的距离
padding -- 内边距
JavaScript  
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/3652d1ccad3647ddbe4c9743131fb75b/clipboard.png
  • 区分大小写
  • 弱变量类型语言  var  变量名=属性值
  • 每行结尾分号可有可无
  • 命名变量

    • 第一个字符必须是字母 下划线或美元      符号
    • 余下的字符可以是下滑线 美元符号或任何字母或数字字符
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/17b716c77f1c41bdad0071a47d4fbab5/clipboard.png
JS的开发步骤
js通常都由一个事件触发.
触发一个函数,定义一个函数,
获得操作对象的控制权.
修改要操作的对象的属性或值
定义函数:
*function 函数名称(){
//函数体
}
window.onload = function(){}
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/82c2321d4c1949498e74e6df4212b3c1/clipboard.png

常用事件 onclick  ondblclick   onmouserover onmouserout onload
引入方式
一种页面内直接编写JS代码,JS偌需要使用<script></script>

alter
C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/dc6d9807033e464a903d684df1223c02/clipboard.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/0dee027464674d77955c8e0102003775/clipboard.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/0fd88ecdd53845f78671266c99d88109/clipboard.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/ebb80ab4a9ee41489cdefdc284091e6c/clipboard.png
* display
    * block:显示元素:
    * none:隐藏元素:

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/1a3079453e274072b3beaeb8cd01392d/clipboard.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/d15f4a92dc8e43d7bb1e8e6ec057c778/lip_image001.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/5a88ad2ea3de44188d03d2c29cc080b8/clipboard.png

C:/Users/%E9%A1%BE%E5%85%AC%E7%88%B5/AppData/Local/YNote/data/qqF389022F54830711172F0070E51CA947/c76c4618a1444cafa0ec4fffe7783c3d/clipboard.png




0 个回复

您需要登录后才可以回帖 登录 | 加入黑马