文章目录
开门见山
【1】练习最基础页面的写法~
【2】练习表格的写法~
1.写在前面
2.笔者的学习方式
3.HTML开学!
4.根据菜鸟教程总结的笔记
4.1 学习之前要了解的
4.2 菜鸟教程HTML笔记直通车
【1】HTML基础概念
【2】HTML基础
html标题
html段落
html链接
html图像
【3】HTML元素
【4】HTML属性
【5】HTML换行
【6】文本格式化标签
【7】HTML链接
*HTML写链接的时候要始终将正斜杠添加到子文件夹减少HTTP请求
【8】HTML 头部
【9】HTML 图像
*图像标签( ``)和源属性(Src)
*Atl属性
*图像高度与宽的的设置
**高级操作 定义图像地图&图中的可点击区域
【10】HTML表格
【11】HTML列表
【12】HTML区块元素
块级元素
HTML div 元素
内联元素
HTML ``元素
【13】HTML布局-是重点 建议多实战练习!
【14】HTML表单和输入
HTML表单
文本域 text (fields)
密码字段 password
单选按钮 radio(buttons)
复选框 checkbox
提交按钮 submit(button)
下拉列表
【15】HTML框架
iframe 设置高度与宽度
iframe 移除边框
iframe 显示目标链接页面
【16】HTML颜色
【17】HTML脚本
开门见山
学会html可以到达哪种程度? 笔者为想了解前端 HTML的小白们 稍微做一个小小的展示~ (以下实例均为pink老师课程中给到的案例 建议自己照着敲一敲 OR 点击此处获得源代码扔到vscode里试着运行一下~)
【1】练习最基础页面的写法~
【2】练习表格的写法~
1.写在前面
关于HTML 【1】直接问度娘 可以直接弹出来一大堆相关教程 资源丰富 【2】HTML非常容易学习 一天就可以快速入门 【3】入门之后 我们可以让HTML运行在浏览器上 用HTML来写出一个简单的无交互性的网页 阅读完此文 你会得到—— 【1】未接触过的小白们可以省去查找资料的时间 直接快速入门 省时又省力~ 【2】早早在前端的海洋里遨游的前辈们 可以。。看看现在的小白是怎么入门前端的hhh (依旧是 可以跟后辈们聊一聊 自己是怎么入门前端的hh)
2.笔者的学习方式
pink老师教程入门(同学推荐)——菜鸟教程的教程刷一遍巩固基础——独立写几个页面(搭配后面的CSS)加强应用能力 那么接下来 废话不多说——
3.HTML开学!
其实HTML只需要菜鸟教程 &W3school二选一(这两个教程内容大部分是一致的) 即可学好 但是——
为了我们掌握的知识更加牢固 也为了 能在之后的课程中更加适应老师的课 依旧是安利一波pink老师的零基础入门课程~ 不知如何下手的小伙伴赶紧直接听起来吧~
pink老师课程p1-p60(HTML部分) 接下来我会先将我根据菜鸟教程总结的笔记放在下面 后期随着学习过程 如果发现有遗漏 我会及时补充~ 小白们可以边用起来VScode 跟着pink老师敲代码 边用起来Typora 跟着我的笔记 总结一份自己的前端入门笔记~
4.根据菜鸟教程总结的笔记
大家也可以选择自己浏览一遍菜鸟教程来进行一个初步的了解
4.1 学习之前要了解的
学习之前我们首先需要明确——html的重点是什么 学好他们对之后的学习有什么重要的意义 有目的性地去听课看教学视频&看教程 一定能事半功倍~ 【1】HTML重点——常用的标签 也就是后期会接触到的盒子的最基础的表现形态 【2】HTML本身不像其他编程语言是有逻辑性的 利用HTML(&CSS)写出来一个简易网页的过程 更像是搭积木 摆盒子 需要我们的耐心 和对各个标签的熟练应用和掌握
4.2 菜鸟教程HTML笔记直通车
这是我根据菜鸟教程的基础教程+自己的一些理解+pink老师课程中提到的一些内容 总结的一份笔记 小伙伴们可以选择性地康康 大体分为几个大部分
超多字预警!想看个大体框架的赶紧退回到文章中最开头用导航跳过这一块儿~然后反手一个点赞关注收藏 三连 回头慢慢看 就ok[doge] 另外笔记中如果有哪些有问题的地方 也请各位小伙伴慷慨地帮忙指出一下 感谢~
【1】HTML基础概念
可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。
**注意:**对于中文网页需要使用 声明编码,否则会出现乱码。有些浏览器(如 360 浏览器)会设置 GBK 为默认编码,则你需要设置为 。
HTML标签
HTML 标签是由尖括号 包围的关键词,比如
HTML 标签通常是成对出现 的,比如 这段字就是被一对标签加粗了
标签对中的第一个标签是开始标签 ,第二个标签是结束标签
开始和结束标签也被称为开放标签 和闭合标签
< p>
p>
/*这是一对标签*/
HTML 元素
一个 HTML 元素包含了开始标签与结束标签
< p> 这是一个段落 p>
【2】HTML基础
html标题
< h1>
一级标题
h1>
< h6>
六级标题
h6>
html段落
< p>
this is a paragragh
p>
html链接
< a href = " https:www.runoob.com" > this is a link a>
html图像
< img src = " /images/logo.png" width = " 258" height = " 38" >
【3】HTML元素
下式即为HTML元素
< p> xxxxxxx p>
以开始标签起始
以结束标签终止
二者之间是元素的内容
< html>
< body>
< p> 这是第一个段落。 p>
body>
html>
上面的代码中含有三个HTML元素
【4】HTML属性
一般表述于开始标签
例子:
HTML 链接由
标签定义。链接的地址在 href 属性 中指定:
< a href = " http://runoob.com" > 这是菜鸟教程的网址链接 a>
此例中"http://runoob.com"在HTML属性中被指定
【5】HTML换行
使用
在不产生一个新段落的情况下进行换行 例子
< p>
这个< br> 段落< br> 演示了分行的效果~
p>
效果如下:
这个 段落 演示了分行的效果~
【6】文本格式化标签
HTML文本格式化标签
对输出的文本进行格式化 让它们变成 斜体 加粗 有下标 居上 局下 例子
< p>
< sub> 上标字 sub>
< sup> 下标字 sup>
< ins> 插入字 ins>
< del> 删除字 del>
< em> 着重文字 em>
< b> 加粗 b>
< i> 斜体 i>
< p>
效果如下:
上标字 下标字 插入字 删除字 着重文字 加粗 斜体
【7】HTML链接
< a href = " http://runoob.com/" target = " _blank" > 访问菜鸟教程 a>
*HTML写链接的时候要始终将正斜杠添加到子文件夹减少HTTP请求
如果子文件夹的末尾 没有正斜杠 ,就会产生两次HTTP请求,就会对效率产生影响,
假如这样书写链接:href=“http://www.w3school.com.cn/html”,就会向服务器产生两次HTTP 请求。
因为服务器会添加正斜杠到这个地址,然后创建一个新的请求,就像这样:href=“http://www.w3school.com.cn /html/”
【8】HTML 头部
这其中包含了所有**头部标签元素**
在这之中 可以插入脚本(scripts) 插入样式文件(CSS)
可以插入各种meta信息
eg:
为搜索引擎定义关键词
< meta name = " keywords" content = " HTML, CSS, XML, XHTML, JavaScript" >
为网页定义描述内容
< meta name = " description" content = " 免费 Web & 编程 教程" >
定义网页作者
< meta name = " author" content = " Runoob" >
每30秒刷新当前页面
< meta http-equiv = " refresh" content = " 30" >
【9】HTML 图像
*图像标签(
)和源属性(Src)
< img scr = " url(图像的链接)" >
*Atl属性
当图像的链接丢失或者无法打开 时 要显示备用的文本
alt属性用来定义一串预备的可替换的文本
< img src = " boat.gif" alt = " BOAT" >
*图像高度与宽的的设置
< img src = " pulpit.jpg" alt = " Pulpit rock" width = " 304" height = " 228" >
直接设置就行了
**高级操作 定义图像地图&图中的可点击区域
基本知识
1.矩形:左下角顶点坐标为(x1,y1),右上角顶点坐标为(x2,y2)
< area shape = " rect" coords = " x1,y1,x2,y2" href = url>
2.圆形:圆心坐标为(X1,y1),半径为r
< area shape = " circle" coords = " x1,y1,r" href = url>
3.多边形:各顶点坐标依次为(x1,y1)、(x2,y2)、(x3,y3) …
< area shape = " poly" coords = " x1,y1,x2,y2 ......" href = url>
具体例子—行星图片
< img src = " planets.gif" width = " 145" height = " 126" alt = " Planets" usemap = " #planetmap" >
< map name = " planetmap" >
太阳 定义成一个矩形 更好描述
左下角顶点位于(0,0)
右上角顶点位于(82,126)
< area shape = " rect" coords = " 0,0,82,126" alt = " Sun" href = " sun.htm" >
行星1号 圆心位于90,58 半径为3
< area shape = " circle" coords"90,58,3" alt = " Mercury" href = " mercur.htm" >
行星2号 圆心位于124,58 半径为8
< area shape = " circle" coords = " 124,58,8" alt = " Venus" href = " venus.htm" >
map>
此图中 这三块区域都是可以点击的~
【10】HTML表格
表格由 标签来定义。
每个表格均有若干行(由 标签定义)
每行被分割为若干单元格(由 标签定义)
< table border = " 1" > --还加了个边框
< tr>
< td> row 1, cell 1 td>
< td> row 1, cell 2 td>
tr>
< tr>
< td> row 2, cell 1 td>
< td> row 2, cell 2 td>
tr>
table>
表格的表头
表头使用 标签进行定义
大多数浏览器会把表头 显示为粗体居中 的文本
< table border = " 1" >
< tr>
以下两行即为表头
< th> Header 1 th>
< th> Header 2 th>
tr>
< tr>
< td> row 1, cell 1 td>
< td> row 1, cell 2 td>
tr>
< tr>
< td> row 2, cell 1 td>
< td> row 2, cell 2 td>
tr>
table>
效果如下:
【11】HTML列表
无序列表
无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。
无序列表始于
标签 每个列表项始于
标签。
< ul>
< li> Coffee li>
< li> Milk li>
ul>
有序列表
同样,有序列表也是一列项目,列表项目使用数字进行标记。
有序列表始于
标签 每个列表项始于
标签。
< ol>
< li> coffee li>
< li> tea li>
< li> good li>
ol>
coffee
tea
good
*自定义列表
自定义列表不仅仅是一列项目,而是项目及其注释 的组合。
自定义列表始于
标签。 自定义列表项目——以
开始。 自定义列表注释——以
开始。
< dl>
< dt> Coffee dt>
< dd> - black hot drink dd>
< dt> Milk dt>
< dd> - white cold drink dd>
dl>
Coffee
- black hot drink
Milk
- white cold drink
【12】HTML区块元素
——和
HTML可以通过和
把元素组合起来
块级元素
块级元素在浏览器显示时,通常会另起一个新行来开始(和结束)
下面这6个都是块级元素
实例: , ,
, ,,
HTML div 元素
元素是块级元素 可用于组合其他HTML元素的容器
如果与 CSS 一同使用, 元素
可用于对大的内容块设置样式属性 。
文档布局中,取代了用表格定义布局的老式方法。
另外,用元素进行文档布局不是表格的正确用法,元素的作用是显示表格化的数据。
内联元素
内联元素在显示时通常不会以新行开始。
以下7个都是内联元素 可以放到其他标签中改变其属性 也可作为文本简单的一个容器。
实例:
< b> , < td> , < a> , < img> ,< span> ,
< em> |< em/> ---用于插入一个用来呈现为 被强调 的文本。
< i>
HTML
元素
可以用作文本的容器
当与 CSS 一同使用时,
元素可用于为部分 文本设置样式属性 。
< p> my mother has a < span style = “color:blue”> brother(被标记成蓝色) span> o ye p>
上述代码可将 brother 标记成蓝色~
【13】HTML布局-是重点 建议多实战练习!
建议初学者可以先使用标签进行HTML布局的练习 —— 对一个网页进行模仿
等熟练掌握之后可以利用列表标签 段落标签
网站布局
大多数网站会把内容安排到多个列中(就像杂志或报纸那样)
*使用 或者
元素来创建多列
**虽然我们可以使用HTML table标签来设计出漂亮的布局,但是table标签是不建议作为布局工具使用的 - 表格不是布局工具。
另外 CSS 用于对元素进行定位,或者为页面创建背景以及色彩丰富的外观
使用 div 元素
div 元素是用于分组 HTML 元素的块级元素。
使用表格
使用 HTML 标签是创建布局的一种简单的方式。
*即使可以使用 HTML 表格来创建漂亮的布局,但设计表格的目的是呈现表格化数据 - 表格不是布局工具!
第一和最后一行使用 colspan 属性来横跨两列:
HTML布局的一些注意事项
*使用CSS最大的好处:如果把 CSS 代码存放到外部样式表中,那么站点会更易于维护。通过编辑单一的文件,就可以改变所有页面的布局
*由于创建高级的布局非常耗时,使用模板是一个快速的选项。
通过搜索引擎可以找到很多免费的网站模板(您可以使用这些预先构建好的网站布局,并优化它们)。
【14】HTML表单和输入
HTML表单用于收集不同类型的用户输入
HTML表单
表单是一个包含表单元素的区域。
表单元素允许用户在表单中输入内容
例如:文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等
输入元素
文本域 text (fields)
< form>
First name:< input type = " text" name = " firstname" > < br>
Last name:< input type = " text" name = " lastname" >
form>
密码字段 password
< form>
password:
form>
输入密码不会以明文显示 而是以星号或者原点代替
单选按钮 radio(buttons)
引入例子:
< form>
< input type = " radio" name = " sex" value = " male" > male< br>
< input type = " radio" name = " sex" value = " female" > female
form>
详解:
涉及到的几个属性:
value:提交数据到服务器的值
name:为控件命名 以备后台程序ASP PHP使用
注意!同一组的单选 按钮的name取值 一定要一致 !这样才能起到单选的作用 !
checked:设置 checked=“checked” 时,该选项被默认选中
< form>
< p>
你生活在哪个国家?
p>
< input type = " radio" name = " country" value = " China" checked = " checked" > 中国< br>
< input type = " radio" name = " country" value = " USA" > 美国
form>
默认选择中国~
复选框 checkbox
< form>
< input type = " checkbox" name = " vehicle" vlaue = " bike" > I have a bike< br>
< input type = " checkbox" name = " vehicle" value = " car" > I have a car
form>
可以进行多选~
提交按钮 submit(button)
< form>
username:< input type = " submit" >
form>
与文本框结合起来的应用
用户单击确认按钮时 表单的内容 会被传送到另一个文件
表单
中的动作属性定义了目的文件 的文件名
由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
假如您在上面的文本框内键入几个字母,然后点击确认按钮,那么输入数据会传送到 “html_form_action.php” 的页面。该页面将显示出输入的结果。
< form name = " input" action = " html_form_action.php" method = " get" >
Username: < input type = " text" name = " user" >
< input type = " submit" value = " Submit" >
form>
下拉列表
——
< form>
< select name = " xxx" >
< option value = " " > option>
< option value = " " > option>
< option value = " " > option>
select>
form>
预选下拉列表(初始就有一个默认的选项)
标签里加一个selected即可
< form action = " " >
< select name = " cars" >
< option value = " bc" > 奔驰 option>
< option value = " bwm" > 宝马 option>
< option value = " audi" selected > 奥迪双钻 option>
< option value = " lsls" > 劳斯莱斯 option>
select>
form>
【15】HTML框架
iframe 设置高度与宽度
height 和 width 属性用来定义iframe标签的高度与宽度。
< iframe src = “demo_iframe. htm" width=" 200 " height=" 200 ">
< / iframe>
iframe 移除边框
< iframe src= "demo_iframe.html" frameborder= "0" >
< / iframe>
frameborder属性用于定义iframe的表示中是否显示边框
设置属性值为“0”—— 移除iframe的边框
iframe 显示目标链接页面
iframe可以显示一个目标链接的页面
目标链接的属性必须使用iframe的属性,
< iframe src= "demo_iframe.html" name= "iframe_a" > < / iframe>
< p> < a href= "http://www.runoob.com" target= "iframe_a" > RUNOOB. COM< / a> < / p>
正常表达结果应该是 RUNOOB.COM的超链接配一个链接的页面—— 即为
(由于此处图像的链接 不可用 所以无法显示辽。。)
RUNOOB.COM
【16】HTML颜色
HTML 颜色由一个十六进制符号来定义,这个符号由红色、绿色和蓝色的值组成(RGB)。—red green blue
每种颜色的最小值是0(十六进制:#00)。最大值是255(十六进制:#FF)。
想要什么颜色 直接用截图的取色器取就行了。
【17】HTML脚本
JavaScript使HTML页面具有更强的动态性和交互性
而
定义了客户端脚本
定义了不支持脚本浏览器输出的文本
在body中插入一段简单的脚本用
< html>
< head>
< meta charset = " utf-8" >
< title> 菜鸟教程(runoob.com) title>
head>
< body>
< script>
document. write ( "Hello World!" )
script>
body>
html>
在不支持JavaScript的浏览器中用标签
< html>
< head>
< meta charset = " utf-8" >
< title> 菜鸟教程(runoob.com) title>
head>
< body>
< script>
document. write ( "Hello World!" )
script>
< noscript> 抱歉,你的浏览器不支持 JavaScript! noscript>
< p> 不支持 JavaScript 的浏览器会使用 < noscript> 元素中定义的内容(文本)来替代。 p>
body>
html>
HTML总结
上述知识熟练掌握后 我们已经可以使用HTML创建站点了!
【1】HTML 是一种在 Web 上使用的通用标记语言。
【2】HTML 允许你格式化文本 ,添加图片 ,创建 链接、输入表单、框架和表格 等等,并可将之存为文本文件,浏览器即可读取和显示。
【3】HTML的关键是
标签!
标签的作用是指示将要出现的内容!
学完HTML之后进行
CSS
JavaScript
的学习
5.写在后面
以上内容就是笔者三轮学习HTML的成果辽 一轮——pink老师课程 跟着视频敲一敲代码 制作一下页面 二轮——菜鸟教程 跟着教程中列出的知识点 制作了一份笔记(即为4中所展示的内容) 三轮——CSDN个人博客 将笔记总结一遍 放到个人博客上 接下来加深印象的同时也督促我进行接下来的学习和不断总结
最后 还是要 多敲代码 多模仿页面 搭配CSS一起进行页面布局的练习 以达到基础的100%熟练与扎实~ 那么 接下来我将随着学习进度的不断推进 更新我的个人学习博客~ 我们下期再见~
你可能感兴趣的:(前端开发,html)
固定表头、首列 —— uniapp、vue 项目
菲力蒲LY
vue.js uni-app 前端
项目实地:也可以在【微信小程序】搜索体验:xny.handbook另一个体验项目:官网一、效果展示二、代码展示(1)html部分股票代码建议投金额实际投金额建议股数实际股数◎原单价涨出-单价↑跌出+单价↓+○预赚+●实赚-○预赔-●实赔操作{{item.stockCode}}{{item.calculAdvsIvsMoney}}{{item.calculRealIvsMoney}}{{item.t
Dash 简介
tankusa
dash
Dash是一个基于Python的开源框架,专门用于构建数据分析和数据可视化的Web应用程序。Dash由Plotly团队开发,旨在帮助数据分析师、数据科学家和开发人员快速创建交互式的、基于数据的Web应用,而无需深入掌握前端技术(如HTML、CSS和JavaScript)。Dash的核心优势在于其简单易用性和强大的功能。通过Dash,用户可以使用纯Python代码来构建复杂的Web应用,而无需编写繁
Python __init__.py
愚昧之山绝望之谷开悟之坡
python init
Python__init__.py作用详解尼古拉苏关注12018.06.1012:57:34字数745阅读45,278转载于:https://www.cnblogs.com/tp1226/p/8453854.html__init__.py该文件的作用就是相当于把自身整个文件夹当作一个包来管理,每当有外部import的时候,就会自动执行里面的函数。1.标识该目录是一个python的模块包(modul
Yarn:包管理优化与工作空间的最佳实践
在现代前端开发中,包管理工具是不可或缺的工具之一。Yarn作为一个快速、可靠且安全的包管理工具,相对于npm,提供了一些独特的功能和优化,尤其是在工作空间管理和性能优化方面尤为突出。本文将深入探讨Yarn的专业使用,包括其工作空间的强大功能、性能优化技术以及在大型项目中的最佳实践。Yarn简介Yarn是由Facebook开发的一个JavaScript包管理工具,它旨在解决npm的一些关键问题,如安
vscode 好用插件
yqcoder
vscode ide 编辑器
一、通用效率类1.AutoRenameTag在编写HTML或XML代码时,当你修改一个标签的名称,它会自动同步修改对应的结束标签,节省了手动修改的时间,提高了代码的准确性和编写效率。2.BracketPairColorizer为代码中的括号对(如()、{}、[])添加不同的颜色,让你可以更清晰地分辨嵌套的括号层次,尤其在处理复杂代码时,能有效减少因括号匹配错误导致的问题。3.CodeRunner支
Python字符串操作
weixin_30871905
python
转自http://blog.chinaunix.net/u/19742/showart_382176.html#Python字符串操作'''1.复制字符串'''#strcpy(sStr1,sStr2)sStr1='strcpy'sStr2=sStr1sStr1='strcpy2'printsStr2'''2.连接字符串'''#strcat(sStr1,sStr2)sStr1='strcat'sSt
web前端期末大作业:婚纱网页主题网站设计——唯一旅拍婚纱公司网站HTML+CSS+JavaScript
IT-司马青衫
前端 课程设计 html
静态网站的编写主要是用HTMLDⅣV+CSSJS等来完成页面的排版设计,一般的网页作业需要融入以下知识点:div布局、浮动定位、高级css、表格、表单及验证、js轮播图、音频视频Fash的应用、uli、下拉导航栏、鼠标划过效果等知识点,学生网页作业源码,制作水平和原创度都适合学习或交作业用,记得点赞。精彩专栏推荐【作者主页——获取更多优质源码】【web前端期末大作业——毕设项目精品实战案例(1
Webpack打包构建流程
码上跑步
webpack 前端 node.js
webpack的打包构建流程为什么需要打包?在前端有非常多的资源,如css、js、vue、vue、图片、字体等。有些资源需要加工处理1.ts->jsts-loader2.css->css-loader+style-loader3.图片->file-loader+url-loader4.html->html-webpack-plugin需要对产物进行优化optimization(webpack优化配
webpack
码上跑步
webpack 前端 node.js
webpack介绍webpack是一个构建工具,实现了模块化管理项目.他的工作方式是用各种loader将各种资源转化为js文件或者对js文件进行压缩编译亦或对静态资源进行处理.官网:webpack由来模块化存在一些问题1.ESM的兼容性问题2.模块文件过多,网络请求频繁3.前端的所有资源包括html和css都需要模块化构建工具应运而生,需要一个集编译,模块打包,支持不同的资源的模块打包工具.Web
Vue初体验
码上跑步
vue.js 前端
Vue基础Vue是什么?Vue是javascript的渐进式框架。Vue初识Vue工作时必须要创建一个Vue的实例,并且传入一个配置对象。root容器里的代码是符合html的语法但是新添加了一些Vue语法,在这些地方Vue会自动进行解析。root容器里的代码称为Vue模版。Vue实例和容器是一一对应的。在实际开发中只有一个Vue,配合组件使用。在vue里的插值{{}}内部只要写js表达式就能正常解
CSS入门指南:从零开始学习网页开发——(一)简介
GIS小白吃
css 学习 前端
一、什么是CSS?CSS(CascadingStyleSheets,层叠样式表)是一种用于描述网页的外观和布局的样式表语言。它通过定义网页元素的样式(如颜色、字体、边距等)来与HTML内容分离,提升了网页的可维护性和设计的灵活性。CSS的核心目的是增强网页的表现力。早期的网页仅使用HTML来进行内容的展示,但由于HTML只能描述内容的结构,页面设计和内容变得难以管理。于是,CSS作为一种辅助技术应
关于Jquery基本内容一
gloria123_
jquery 前端 javascript
jQuery(jQ)html+css+js1jQ是一个js库,封装了大量的特定的集合(函数和方法)如animate()、css()、show()等2使用jQ大大提高开发效率,简化dom操作常见的js库jQueryYUIDojoExtJszeptojQuery选择器$(selector)筛选方法parent()$(“li”).parent()children(selector)$(“ul”).chi
H5基于Canvas实现电子签名并生成PDF文档
2401_85156853
程序员 pdf 前端 java
3.注册监听事件letbeginX:number,beginY:number;constcanvas:HTMLCanvasElement=canvasDom.current;constctx=canvas.getContext(‘2d’);ctx.fillStyle=‘#fff’;ctx.fillRect(0,0,canvas.width,canvas.height);canvas.addEven
Vue3 基础教程:从入门到实践 (保姆级教学)
前段技术人
学习 前端 vue.js vue
一、Vue3简介Vue.js是一款用于构建用户界面的JavaScript框架,而Vue3作为其最新的主要版本,带来了诸多令人瞩目的改进与新特性,使其在前端开发领域备受青睐。(一)Vue3的优势性能提升:Vue3重写了虚拟DOM算法,显著提高了挂载、更新和渲染的速度。在处理大型列表或频繁数据更新的场景时,Vue3的表现更为出色,能够为用户带来更流畅的交互体验。例如,一个包含大量商品信息的电商产品列表
【 <一> 炼丹初探:JavaWeb 的起源与基础】之 JavaWeb 项目的部署:从开发环境到生产环境
Foyo Designer
firefox 前端 改行学it 经验分享 学习方法 程序人生
点击此处查看合集https://blog.csdn.net/foyodesigner/category_12907601.html?fromshare=blogcolumn&sharetype=blogcolumn&sharerId=12907601&sharerefer=PC&sharesource=FoyoDesigner&sharefrom=from_link一、开发环境:写代码的“温床”在
自助洗车小程序开发方案详解
ALLSectorSorft
小程序 服务器 数据库 微信小程序
自助洗车小程序开发设计详细扩写一、系统架构设计(一)技术栈选型1.前端:微信小程序(原生开发):直接基于微信官方提供的开发框架,能充分利用微信的原生能力,如小程序的启动速度快、与微信生态的无缝衔接等。开发过程中可使用微信开发者工具进行代码编写、调试和预览,通过WXML(类似HTML)、WXSS(类似CSS)和JavaScript构建用户界面和交互逻辑。例如利用微信原生的组件库,快速搭建出美观且符合
MySQL自动建立集合自动分片_1.mongodb初步使用总结
海上行走的狮子
MySQL自动建立集合自动分片
mongoDB2.6使用总结一、准备工作下载java驱动包驱动包下载地址:http://www.doczj.com/doc/3305bc20960590c69ec376c0.html/artifact/org.mongodb/mongo-java-drivermongoDB下载:http://www.doczj.com/doc/3305bc20960590c69ec376c0.html/在线api
前端开发使用的 安卓模拟器_【译】移动开发中的仿真器与模拟器
weixin_39976748
前端开发使用的 安卓模拟器
译者注:本文主要涉及到两个概念:Emulator和Simulator。通常我们在工作中可能统统习惯称为“模拟器”,但实际上二者有所不同。为了分清概念,本文将Emulator译作“仿真器”,Simulator译作“模拟器”。听起来可能略拗口,如产生生理或心理不适,敬请谅解。仿真器(Emulator),又称仿真程序,在软件工程中指可以使计算机或者其他多媒体平台(掌上电脑,手机)能够运行其他平台上的程序
three.js 鼠标点击获取模型对象
lucky_zouzou
javascript 开发语言 ecmascript
three.js创建模型后,想要实现点击模型获取模型对象触发相应事件。可以使用它提供的APITHREE.Raycaster()https://threejs.org/docs/index.html?q=Raycaster#api/en/core/Raycaster//监听点击事件window.addEventListener('click',(event)=>{event.preventDefau
测试websocket接口
驰驰的老爸
webSocket websocket
http://www.cnblogs.com/ListenWind/p/4760179.htmlhttp://www.cnblogs.com/yuanchunli/articles/5265738.html大家接手项目的时候,尤其是App项目,可能有websocket接口,但是测试这个websocket接口不像http接口,直接使用一些接口调用工具就行的,它必须在websocket环境下才能访问到
数据监控工具Mixpanel的简易使用教程
alankuo
大数据
Mixpanel的使用教程如下:注册与准备创建账号:访问Mixpanel官方网站,按照提示填写相关信息创建账号。登录后,在项目设置中可以获取项目密钥。了解基本概念:明确事件、用户属性等基本概念。事件是用户在应用中的操作,如点击按钮、完成注册等;用户属性是描述用户特征的信息,像年龄、城市、会员等级等。集成SDKWeb应用:在HTML文件中引入MixpanelJavaScriptSDK。在页面的标签内
【Python爬虫实战】从多类型网页数据到结构化JSON数据的高效提取策略
易辰君
python爬虫 python 爬虫 开发语言
个人主页:https://blog.csdn.net/2401_86688088?type=blog系列专栏:https://blog.csdn.net/2401_86688088/category_12797772.html目录前言一、数据类型及其对应的提取策略(一)文本数据(二)数值数据(三)链接(四)图像数据(五)表格数据(六)JSON数据(七)动态数据(八)元数据(九)总结二、结构化数据提
最新网络安全-跨站脚本攻击(XSS)的原理、攻击及防御_xsstrike原理
2401_84239830
程序员 web安全 xss 安全
XSS的类型反射型XSS/不持久型XSS存储型XSS/持久型XSS基于DOM的XSS常用Payload与工具XSS扫描工具Payloadsscript标签类结合js的html标签伪协议绕过危害防御简介跨站脚本攻击(全称CrossSiteScripting,为和CSS(层叠样式表)区分,简称为XSS)是指恶意攻击者在Web页面中插入恶意javascript代码(也可能包含html代码),当用户浏览网
使用 marked.min.js 实现 Markdown 编辑器 —— 我的博客后台选择之旅
fxrz12
个人博客 javascript 编辑器 arcgis
最近,我决定为个人博客后台换一个编辑器。之前的富文本编辑器虽然功能齐全,但生成的HTML代码繁杂,维护起来非常麻烦。为了追求更简洁高效的写作体验,我开始研究Markdown编辑器,并最终选择了marked.min.js。1.传统富文本vs.Markdown编辑器在对比了传统富文本编辑器和Markdown编辑器后,我发现它们各有优缺点:特性传统富文本编辑器Markdown编辑器易用性简单直观需学习语
智慧树刷课插件常见问题解决方案
姬虹俪Humble
智慧树刷课插件常见问题解决方案zhihuishu智慧树刷课插件,自动播放下一集、1.5倍速度、无声项目地址:https://gitcode.com/gh_mirrors/zh/zhihuishu1.项目基础介绍本项目是一个开源的智慧树刷课插件,旨在帮助用户自动化观看智慧树教学视频。该插件能够自动播放下一集视频、提供1.5倍速播放以及无声播放的功能。主要使用的编程语言为JavaScript和HTML
html 文本识别标签,HTML 文本标签
北美R哥
html 文本识别标签
一、标题标签单词缩写:head头部.标题为了使网页更具有语义化,我们经常会在页面中用到标题标签,HTML提供了6个等级的标题,即~,代表六个级别的标题,代表最大的标题,代表最小的标题。标题标签语义:作为标题使用,并且依据重要性递减。注意:h1标签因为重要,尽量少用一级标题二级标题三级标题四级标题五级标题六级标题h系列有一个align属性,该属性是标题的对齐方式,默认为left(左对齐),还有cen
Azure AI Document Intelligence 使用指南
scaFHIO
azure 人工智能 flask python
AzureAIDocumentIntelligence使用指南AzureAIDocumentIntelligence(原名AzureFormRecognizer)是一项基于机器学习的服务,可以从数字或扫描PDF、图像、Office和HTML文件中提取文本(包括手写)、表格、文档结构(如标题、节标题等)和键值对。它支持多种格式,包括PDF、JPEG/JPG、PNG、BMP、TIFF、HEIF、DOC
第一章:欢迎来到 HTML 星球!
我自纵横2023
HTML教程 html 前端
第一章:欢迎来到HTML星球!1.1宇宙的基石:HTML是什么?嘿,亲爱的探险家!欢迎踏上这场奇妙的HTML星球大冒险之旅!在我们正式踏入这个充满奇幻色彩的星球之前,咱们得先搞清楚,HTML到底是个啥玩意儿。想象一下,整个互联网就像是一个浩瀚无垠的宇宙,而网页呢,就是这个宇宙里的各个星球。每个星球都有自己独特的风貌和故事,而HTML就是建造这些星球的基石。它就像是宇宙里的乐高积木,咱们可以用各种各
HTML中的块元素与行内元素
王哈哈嘻嘻噜噜
html 前端
1.块级标签块级元素会独占一行,通常用于构建页面的结构。常见的块级元素包括::通用的块级容器。没有任何语意。可以创建网页的不同部分,导航栏侧边栏等。链接1链接2链接3若是想创建一个初始带标签的话:可以直接:#nav或者div.nav或者div#nav创建第二个div标签,第一个是导航栏,第二个就是主要内容了.content文章标题文章内容文章内容文章内容:段落。到:标题。:无序列表。:有序列表。:
python os模块[zt]
weixin_34357962
python 操作系统 shell
pythonos模块(2008-07-0311:59:39)http://blog.sina.com.cn/s/blog_4e808acf01009uav.html标签:pythonos杂谈分类:pythonPython的标准库中的os模块包含普遍的操作系统功能。如果你希望你的程序能够与平台无关的话,这个模块是尤为重要的。即它允许一个程序在编写后不需要任何改动,也不会发生任何问题,就可以在Linu
多线程编程之存钱与取钱
周凡杨
java thread 多线程 存钱 取钱
生活费问题是这样的:学生每月都需要生活费,家长一次预存一段时间的生活费,家长和学生使用统一的一个帐号,在学生每次取帐号中一部分钱,直到帐号中没钱时 通知家长存钱,而家长看到帐户还有钱则不存钱,直到帐户没钱时才存钱。
问题分析:首先问题中有三个实体,学生、家长、银行账户,所以设计程序时就要设计三个类。其中银行账户只有一个,学生和家长操作的是同一个银行账户,学生的行为是
java中数组与List相互转换的方法
征客丶
JavaScript java jsonp
1.List转换成为数组。(这里的List是实体是ArrayList)
调用ArrayList的toArray方法。
toArray
public T[] toArray(T[] a)返回一个按照正确的顺序包含此列表中所有元素的数组;返回数组的运行时类型就是指定数组的运行时类型。如果列表能放入指定的数组,则返回放入此列表元素的数组。否则,将根据指定数组的运行时类型和此列表的大小分
Shell 流程控制
daizj
流程控制 if else while case shell
Shell 流程控制
和Java、PHP等语言不一样,sh的流程控制不可为空,如(以下为PHP流程控制写法):
<?php
if(isset($_GET["q"])){
search(q);}else{// 不做任何事情}
在sh/bash里可不能这么写,如果else分支没有语句执行,就不要写这个else,就像这样 if else if
if 语句语
Linux服务器新手操作之二
周凡杨
Linux 简单 操作
1.利用关键字搜寻Man Pages man -k keyword 其中-k 是选项,keyword是要搜寻的关键字 如果现在想使用whoami命令,但是只记住了前3个字符who,就可以使用 man -k who来搜寻关键字who的man命令 [haself@HA5-DZ26 ~]$ man -k
socket聊天室之服务器搭建
朱辉辉33
socket
因为我们做的是聊天室,所以会有多个客户端,每个客户端我们用一个线程去实现,通过搭建一个服务器来实现从每个客户端来读取信息和发送信息。
我们先写客户端的线程。
public class ChatSocket extends Thread{
Socket socket;
public ChatSocket(Socket socket){
this.sock
利用finereport建设保险公司决策分析系统的思路和方法
老A不折腾
finereport 金融保险 分析系统 报表系统 项目开发
决策分析系统呈现的是数据页面,也就是俗称的报表,报表与报表间、数据与数据间都按照一定的逻辑设定,是业务人员查看、分析数据的平台,更是辅助领导们运营决策的平台。底层数据决定上层分析,所以建设决策分析系统一般包括数据层处理(数据仓库建设)。
项目背景介绍
通常,保险公司信息化程度很高,基本上都有业务处理系统(像集团业务处理系统、老业务处理系统、个人代理人系统等)、数据服务系统(通过
始终要页面在ifream的最顶层
林鹤霄
index.jsp中有ifream,但是session消失后要让login.jsp始终显示到ifream的最顶层。。。始终没搞定,后来反复琢磨之后,得到了解决办法,在这儿给大家分享下。。
index.jsp--->主要是加了颜色的那一句
<html>
<iframe name="top" ></iframe>
<ifram
MySQL binlog恢复数据
aigo
mysql
1,先确保my.ini已经配置了binlog:
# binlog
log_bin = D:/mysql-5.6.21-winx64/log/binlog/mysql-bin.log
log_bin_index = D:/mysql-5.6.21-winx64/log/binlog/mysql-bin.index
log_error = D:/mysql-5.6.21-win
OCX打成CBA包并实现自动安装与自动升级
alxw4616
ocx cab
近来手上有个项目,需要使用ocx控件
(ocx是什么?
http://baike.baidu.com/view/393671.htm)
在生产过程中我遇到了如下问题.
1. 如何让 ocx 自动安装?
a) 如何签名?
b) 如何打包?
c) 如何安装到指定目录?
2.
Hashmap队列和PriorityQueue队列的应用
百合不是茶
Hashmap队列 PriorityQueue队列
HashMap队列已经是学过了的,但是最近在用的时候不是很熟悉,刚刚重新看以一次,
HashMap是K,v键 ,值
put()添加元素
//下面试HashMap去掉重复的
package com.hashMapandPriorityQueue;
import java.util.H
JDK1.5 returnvalue实例
bijian1013
java thread java多线程 returnvalue
Callable接口:
返回结果并且可能抛出异常的任务。实现者定义了一个不带任何参数的叫做 call 的方法。
Callable 接口类似于 Runnable,两者都是为那些其实例可能被另一个线程执行的类设计的。但是 Runnable 不会返回结果,并且无法抛出经过检查的异常。
ExecutorService接口方
angularjs指令中动态编译的方法(适用于有异步请求的情况) 内嵌指令无效
bijian1013
JavaScript AngularJS
在directive的link中有一个$http请求,当请求完成后根据返回的值动态做element.append('......');这个操作,能显示没问题,可问题是我动态组的HTML里面有ng-click,发现显示出来的内容根本不执行ng-click绑定的方法!
 
【Java范型二】Java范型详解之extend限定范型参数的类型
bit1129
extend
在第一篇中,定义范型类时,使用如下的方式:
public class Generics<M, S, N> {
//M,S,N是范型参数
}
这种方式定义的范型类有两个基本的问题:
1. 范型参数定义的实例字段,如private M m = null;由于M的类型在运行时才能确定,那么我们在类的方法中,无法使用m,这跟定义pri
【HBase十三】HBase知识点总结
bit1129
hbase
1. 数据从MemStore flush到磁盘的触发条件有哪些?
a.显式调用flush,比如flush 'mytable'
b.MemStore中的数据容量超过flush的指定容量,hbase.hregion.memstore.flush.size,默认值是64M 2. Region的构成是怎么样?
1个Region由若干个Store组成
服务器被DDOS攻击防御的SHELL脚本
ronin47
mkdir /root/bin
vi /root/bin/dropip.sh
#!/bin/bash/bin/netstat -na|grep ESTABLISHED|awk ‘{print $5}’|awk -F:‘{print $1}’|sort|uniq -c|sort -rn|head -10|grep -v -E ’192.168|127.0′|awk ‘{if($2!=null&a
java程序员生存手册-craps 游戏-一个简单的游戏
bylijinnan
java
import java.util.Random;
public class CrapsGame {
/**
*
*一个简单的赌*博游戏,游戏规则如下:
*玩家掷两个骰子,点数为1到6,如果第一次点数和为7或11,则玩家胜,
*如果点数和为2、3或12,则玩家输,
*如果和为其它点数,则记录第一次的点数和,然后继续掷骰,直至点数和等于第一次掷出的点
TOMCAT启动提示NB: JAVA_HOME should point to a JDK not a JRE解决
开窍的石头
JAVA_HOME
当tomcat是解压的时候,用eclipse启动正常,点击startup.bat的时候启动报错;
报错如下:
The JAVA_HOME environment variable is not defined correctly
This environment variable is needed to run this program
NB: JAVA_HOME shou
[操作系统内核]操作系统与互联网
comsci
操作系统
我首先申明:我这里所说的问题并不是针对哪个厂商的,仅仅是描述我对操作系统技术的一些看法
操作系统是一种与硬件层关系非常密切的系统软件,按理说,这种系统软件应该是由设计CPU和硬件板卡的厂商开发的,和软件公司没有直接的关系,也就是说,操作系统应该由做硬件的厂商来设计和开发
富文本框ckeditor_4.4.7 文本框的简单使用 支持IE11
cuityang
富文本框
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>知识库内容编辑</tit
Property null not found
darrenzhu
datagrid Flex Advanced propery null
When you got error message like "Property null not found ***", try to fix it by the following way:
1)if you are using AdvancedDatagrid, make sure you only update the data in the data prov
MySQl数据库字符串替换函数使用
dcj3sjt126com
mysql 函数 替换
需求:需要将数据表中一个字段的值里面的所有的 . 替换成 _
原来的数据是 site.title site.keywords ....
替换后要为 site_title site_keywords
使用的SQL语句如下:
updat
mac上终端起动MySQL的方法
dcj3sjt126com
mysql mac
首先去官网下载: http://www.mysql.com/downloads/
我下载了5.6.11的dmg然后安装,安装完成之后..如果要用终端去玩SQL.那么一开始要输入很长的:/usr/local/mysql/bin/mysql
这不方便啊,好想像windows下的cmd里面一样输入mysql -uroot -p1这样...上网查了下..可以实现滴.
打开终端,输入:
1
Gson使用一(Gson)
eksliang
json gson
转载请出自出处:http://eksliang.iteye.com/blog/2175401 一.概述
从结构上看Json,所有的数据(data)最终都可以分解成三种类型:
第一种类型是标量(scalar),也就是一个单独的字符串(string)或数字(numbers),比如"ickes"这个字符串。
第二种类型是序列(sequence),又叫做数组(array)
android点滴4
gundumw100
android
Android 47个小知识
http://www.open-open.com/lib/view/open1422676091314.html
Android实用代码七段(一)
http://www.cnblogs.com/over140/archive/2012/09/26/2611999.html
http://www.cnblogs.com/over140/arch
JavaWeb之JSP基本语法
ihuning
javaweb
目录
JSP模版元素
JSP表达式
JSP脚本片断
EL表达式
JSP注释
特殊字符序列的转义处理
如何查找JSP页面中的错误
JSP模版元素
JSP页面中的静态HTML内容称之为JSP模版元素,在静态的HTML内容之中可以嵌套JSP
App Extension编程指南(iOS8/OS X v10.10)中文版
啸笑天
ext
当iOS 8.0和OS X v10.10发布后,一个全新的概念出现在我们眼前,那就是应用扩展。顾名思义,应用扩展允许开发者扩展应用的自定义功能和内容,能够让用户在使用其他app时使用该项功能。你可以开发一个应用扩展来执行某些特定的任务,用户使用该扩展后就可以在多个上下文环境中执行该任务。比如说,你提供了一个能让用户把内容分
SQLServer实现无限级树结构
macroli
oracle sql SQL Server
表结构如下:
数据库id path titlesort 排序 1 0 首页 0 2 0,1 新闻 1 3 0,2 JAVA 2 4 0,3 JSP 3 5 0,2,3 业界动态 2 6 0,2,3 国内新闻 1
创建一个存储过程来实现,如果要在页面上使用可以设置一个返回变量将至传过去
create procedure test
as
begin
decla
Css居中div,Css居中img,Css居中文本,Css垂直居中div
qiaolevip
众观千象 学习永无止境 每天进步一点点 css
/**********Css居中Div**********/
div.center {
width: 100px;
margin: 0 auto;
}
/**********Css居中img**********/
img.center {
display: block;
margin-left: auto;
margin-right: auto;
}
Oracle 常用操作(实用)
吃猫的鱼
oracle
SQL>select text from all_source where owner=user and name=upper('&plsql_name');
SQL>select * from user_ind_columns where index_name=upper('&index_name'); 将表记录恢复到指定时间段以前
iOS中使用RSA对数据进行加密解密
witcheryne
ios rsa iPhone objective c
RSA算法是一种非对称加密算法,常被用于加密数据传输.如果配合上数字摘要算法, 也可以用于文件签名.
本文将讨论如何在iOS中使用RSA传输加密数据. 本文环境
mac os
openssl-1.0.1j, openssl需要使用1.x版本, 推荐使用[homebrew](http://brew.sh/)安装.
Java 8
RSA基本原理
RS