BootStrap框架
BootStrap框架背景
源码下载:https://v3.bootcss.com/getting-started/#download
免费BootStrap的CDN加速
1234567<!-- BootStrap在使用的时候需要引入样式文件、js文件 --><!-- 最新版本的 Bootstrap 核心 CSS 文件 --><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"><!-- 最新的 Bootstrap 核心 JavaScript 文件 --><script src="h ...
JQuery
JQuery简介引入JQuery下载:https://jquery.com/
JQuery.mousewheel.js下载:https://plugins.jquery.com/mousewheel/
123456789<!-- 直接在页面将js文件嵌入进来 --><script type="text/javascript" src="js/jquery-1.12.2.js"></script><!-- JQuery中没有滚轮事件,因此还需要引入滚轮事件的插件 --><!-- 1. 下载的文件中含有两个js文件,其中带mini的是压缩后的,未加mini的是原始的库,生产环境中使用带mini的。2. 学习时,应该阅读不带mini的-->
JQuery与原生js的区别
原生JS
1234567<script type="text/javascript"> // 原生js书写方案,onload必须等到页面全部渲染完成以后才会执行 window.on ...
Javascript笔记
Javascript笔记简略嵌入方式
行间事件
1<input type="button" name="" value="按钮" onclick="alert('ok');" />
页面插入
123<script type="text/javascript"> alert("ok");</script>
外部引入
1<script type="text/javascript" src="test.js" ></script>
变量
定义方式
1var 变量名 = 初始值;
变量类型
数字(number)、字符串(string)、布尔(boolean)、未定义(undefined,未初始化的对象)、null(存放对象的未初始化变量)
注释
123// 单行注释/*多行注释*/
变量、函数、属性、函数参数命名规范
区分大小写
第一 ...
CSS相关知识
知识点背景
css的定义方法:选择器 { 属性:值; 属性:值; 属性:值;}
1234567/* css注释 */div{ width:100px; height:100px; color:red }
样式引入
12345678910<!-- 外联方式 --><link rel="stylesheet" type="text/css" href="css/main.css"><!-- 嵌入式 --><style type="text/css"> div{ width:100px; height:100px; color:red }</style><!-- 内联式 --><div style="width:100px; height:100px; color:red ">......</div>
CSS常用文本样式1 ...
html相关知识
知识点HTML文档结构
HTML是超文本标记语言,超文本指超链接,标记指标签,专门用于制作网页,由一个个标签组成
文件拓展名为html,或htm
它可以用文本编辑器进行编辑,用浏览器打开后,浏览器会自动渲染成网页
1234567891011<!DOCTYPE HTML><!--html文档必须要申明html版本,否则会默认以最低版本进行解析--><html lang="en"><!-- lang="en":用于标记网页的语言为英文,可写可不写,一般用于统计使用--><head> <!--可以标识网页的属性信息,外部的引用信息等--> </head><body> <!-- 可以设置网页内容显示的信息--> </body> </html>
标题、段落、字符实体
标题:
1h1、h2、h3、h4、h5、h6:分别对应于标题1~6,他们都是成对的
段落:
1234567p:用于定义段落,默 ...
盒子模型
盒子模型知识点背景页面中的元素都是一个个方块组成,我们将其称之为盒子模型,设置对应的样式分别为:盒子的宽度(width)、盒子的高度(height)、盒子的边框(border)、盒子内的内容和边框之间的间距(padding)、盒子与盒子之间的间距(margin)
内容1234567891011121314151617181920212223/* 设置宽高 */width:200px; /* 设置盒子的宽度,此宽度是指盒子内容的宽度,不是盒子整体宽度(难点) */ height:200px; /* 设置盒子的高度,此高度是指盒子内容的高度,不是盒子整体高度(难点) *//* 设置边框 */border-top-color:red; /* 设置顶部边框颜色为红色 */ border-top-width:10px; /* 设置顶部边框粗细为10px */ border-top-style:solid; /* 设置顶部边框的线性为实线,常用的有:solid(实线) dashed(虚线) dotted(点线); */border-top:10px solid red; ...
HTML之表单
HTML之表单知识点
在表单中,针对每一个input都要设置一个属性值:name,它是提交表单时的键值
针对input中”radio”和”checkbox”,除了设置name,还需要设置属性值:value,用于标识选择的是什么数据
除了提交按钮外,其它input中的value属性都是用来定义该表单元素的值。name属性标识表单元素的名称,此名称是提交数据时的键名
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172<!--1. action属性:定义表单数据提交地址2. method属性:定义表单提交的方式,一般有“get”方式和“post”方式--><form action="http://www..." method="get"> <p> <!-- ...