Web 前端基础
白菜执笔人
这个作者很懒,什么都没留下…
展开
-
JS 阻止浏览器默认行为
Web前端基础 学习笔记一、JS 阻止浏览器默认行为1.1、阻止超链接跳转<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JS 阻止浏览器默认行为</title> <script type="text/javas...原创 2019-10-24 21:19:47 · 2108 阅读 · 0 评论 -
JS 事件 —— 表单事件
Web前端基础 学习笔记一、表单事件1.1、onsubmit(绑定提交事件)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JS 事件-鼠标事件</title> <script> window.onlo...原创 2019-10-24 19:17:46 · 1527 阅读 · 0 评论 -
JS 事件 —— 键盘事件
Web前端基础 学习笔记一、JS 键盘事件1.1、按下字符键触发<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JS 键盘事件</title> <script type="text/javascript">...原创 2019-10-24 16:06:04 · 277 阅读 · 0 评论 -
JS 事件 —— 鼠标事件
Web前端基础 学习笔记一、JS 事件1.1、什么是 JS 事件js 事件是用来获取事件的详细信息,如鼠标位置、键盘按键等。1.2、主要分为:鼠标事件、键盘事件、表单事件1.3、组成:on + 事件名称二、鼠标事件...原创 2019-10-24 15:24:20 · 435 阅读 · 0 评论 -
JS BOM & DOM
Web前端基础 学习笔记一、JS - BOM1.1、什么是 BOMBOM 就是浏览器的对象模型,浏览器可以通过调用系统对话框,向用户显示信息。1.2、系统提供了三个函数,可以完成系统对话框的操作window.alert("警告框");window.confirm("请选择确定和取消");window.prompt("请输入一个数","默认值");<head> ...原创 2019-10-22 17:18:19 · 93 阅读 · 0 评论 -
JS 基础
Web前端基础 学习笔记一、JS 的简介1.1、什么是 JS JavaScript 是一种专为与网页交互而设计的客户端脚本语言。最初是为了实现表单验证之前表单验证都是在服务器完成。1.2、JS 的组成核心(ECMAScript)浏览器对象模型(BOM) Broswer object mode...原创 2019-10-22 15:29:29 · 77 阅读 · 0 评论 -
CSS 文本溢出 —— overflow
Web前端基础 学习笔记CSS 文本溢出 - overflow 使用verflow 属性:定义溢出元素内容区的内容会如何处理语法: { overflow: visible / hidden / scroll / auto / inherit; }说明:visible: 默认值,内容不会被修剪,会出现在元素框之外;hidden: 内容会被修剪,并且其余内容是不可见的;scroll...原创 2019-10-21 13:47:20 · 505 阅读 · 0 评论 -
CSS 盒模型
Web前端基础 学习笔记一、盒模型介绍盒模型又称框模型(Box Model),包含了 元素内容(content)、内边框(padding)、边框(border)、外边距(margin) 几个要素。二、CSS 盒模型 - border2.1、使用方法:border: 边框宽度 边框样式 边框颜色; ,如:{ border: 5px solid #f00; }边框宽度: borde...原创 2019-10-21 13:27:32 · 97 阅读 · 0 评论 -
CCS 浮动
Web前端基础 学习笔记一、CCS 浮动 浮动,主要为了脱离文档流(垂直排列) 语法: 选择符 { float: left/right } 特点:.div 块元素失去“块状”换行显示特征,变为行内元素;紧贴上一个浮动元素(同方向)或父级元素的边框,如宽度不够将换行显示占据行内元素(文字段落)的空间,导致行内元素围绕显...原创 2019-10-20 19:10:51 · 235 阅读 · 0 评论 -
CSS 文本、列表、背景图样式
Web前端基础 学习笔记一、常用文本样式1.1、文本属性font-size: 文字大小 ,默认16px;font-family: 字体;font-style: 是否倾斜,通常用于去倾斜,italic(倾斜),normal(正常);font-weight: 是否加粗,bold(加粗),normal(正常)line-height: 行高,第二行底部到第一行底部的高度;text-dec...原创 2019-10-20 18:31:51 · 259 阅读 · 0 评论 -
CSS 通配、群组、包含、伪类选择器
Web前端基础 学习笔记一、CSS 通配选择器语法:*{ 属性名: 属性值; }在整个 html 文件当中如果想要选中所有元素,则用 通配选择符;但通常使用去掉所有边距,比如:*{margin:0;padding:0;}<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...原创 2019-10-20 17:10:26 · 515 阅读 · 0 评论 -
CSS 元素、id、class 选择器
Web前端基础 学习笔记一、元素选择器语法:语法:标签名{ 属性名: 属性值; }元素选择器 也就是已经存在的标签的元素名称(比如已存在 p 标签),只要设置一次, 之后所有同类表情的格式都一样 (前提是没有设置其他选择器),如, 下面的所以 p 标签的内容都是 “首行缩进”。<!DOCTYPE html><html lang="en"><head...原创 2019-10-20 17:08:21 · 325 阅读 · 0 评论 -
HTML 列表、图片、超链接
Web前端基础 学习笔记一、列表标签1.1、无需列表标签(最常用,可用图标替代)语法: <h3>无序列表标签语法:</h3> <ul type=""> <li>ul 的 type 属性, 默认 disc</li> </ul> <ul type="circle"> <li>ul 的...原创 2019-09-28 21:35:18 · 2521 阅读 · 0 评论 -
HTML 结构 与 基础标签
Web前端基础 学习笔记一、Html 基本结构1.1、创建文件Ctrl + N 新建一个文件Ctrl + S 保存,命名为 xxx.html右键 ,选择 Open in Brower(在浏览器中打开)1.2、结构我们已经安装了模块,所以一个感叹号 ! + Tab键 就可以直接生成下面整一块代码注意点:<!DOCTYPE hmtl> 仅声明文档类型 非标签.标...原创 2019-09-28 20:17:30 · 112 阅读 · 0 评论 -
前端 及 HTML
Web前端基础 学习笔记一、前端介绍1.1、web 1.0 时代网页制作网页制作是 web1.0 时代的产物,那个时候的网页主要是静态网页1.2、web 2.0 时代前端开发这个时候,网页有静态网页和动态网页1.3、前端其主要包括三个方面:HTML 结构 、CSS样式 、 JavaScript行为(1)HTML 结构: 就是网页的基础、模型,就像是建房子时,房子的结构。...原创 2019-09-28 18:40:09 · 105 阅读 · 0 评论