首页
导航
统计
留言
更多
壁纸
直播
关于
推荐
星的魔法
星的导航页
星的云盘
谷歌一下
腾讯视频
Search
1
Ubuntu安装 kubeadm 部署k8s 1.30
152 阅读
2
kubeadm 部署k8s 1.30
106 阅读
3
rockylinux 9.3详细安装drbd
101 阅读
4
rockylinux 9.3详细安装drbd+keepalived
97 阅读
5
ceshi
66 阅读
默认分类
日记
linux
docker
k8s
ELK
Jenkins
Grafana
Harbor
Prometheus
Cepf
k8s安装
Gitlab
traefik
sonarqube
OpenTelemetry
MinIOn
golang
Git
Python
Web开发
HTML和CSS
JavaScript
对象模型
登录
/
注册
Search
标签搜索
k8s
linux
docker
drbd+keepalivde
ansible
dcoker
webhook
星
累计撰写
75
篇文章
累计收到
936
条评论
首页
栏目
默认分类
日记
linux
docker
k8s
ELK
Jenkins
Grafana
Harbor
Prometheus
Cepf
k8s安装
Gitlab
traefik
sonarqube
OpenTelemetry
MinIOn
golang
Git
Python
Web开发
HTML和CSS
JavaScript
对象模型
页面
导航
统计
留言
壁纸
直播
关于
推荐
星的魔法
星的导航页
星的云盘
谷歌一下
腾讯视频
搜索到
73
篇与
的结果
2025-02-05
css基础
一、css3是什么CSS3就是css语言,数字3是该语言的版本号;css语言开发的文件是以.css为后缀,通过在html文件中引入该css文件来控制html代码的样式(css语言代码也可以直接写在html文件中),采用的语言是级联样式表(Cascading Style Sheet),也属于标记语言。二、css3如何学习学习方向:从css代码书写位置、css选择器和css具体样式设置三部分进行学习 学习目的:完成页面样式布局和位置布局三、css代码书写位置css是来控制页面标签的样式,但是可以根据实际情况书写在不同的位置,放在不同位置有不同的专业叫法,可以分为行间式、内联式和外联式三种。 3.1 行间试 css样式书写在标签的style全局属性中,一条样式格式为 样式名: 样式值 单位;,可以同时出现多条样式<!-- 关键代码 --> <!-- 给div标签设置宽高背景颜色 --> <div style="width: 200px; height: 200px; background-color: orange;">内容</div>3.2 内联式 css样式书写在head标签内的style标签中,样式格式为 css选择器{样式块},样式块由一条条样式组成<!-- 关键代码 --> <head> <style> /* css语法下的注释语法 */ /* 设置页面中所有h2标签宽高背景颜色 */ h2 { width: 50px; height: 50px; background-color: orange; } /* 设置页面中所有h3标签宽高背景颜色 */ h3 { width: 100px; height: 100px; background-color: red; } </style> </head> <body> <h2></h2> <h2></h2> <h3></h3> <h3></h3> </body>3.3 外联式 css样式的写法同内联式,但样式书写在css文件中,在html页面中用link标签引入css文件(建议在head标签中引入)css文件夹下的my.css/* html文件会引入该css文件,设置所有引入了html文件中的所有p标签宽高背景颜色 */ p { width: 50px; height: 50px; background-color: orange; }根目录下的first.html<!-- 关键代码 --> <head> <!-- rel="stylesheet":引入的是层级样式表,也就是css文件 type="text/css":引入文件采用的是css语法书写文本类型代码 href="css/my.css":采用相当路径引入目标css文件 --> <link rel="stylesheet" type="text/css" href="css/my.css"> </head> <body> <!-- 该页面中的p标签样式都被my.css文件控制 --> <p></p> <p></p> </body>根目录下的second.html<head> <link rel="stylesheet" type="text/css" href="css/my.css"> </head> <body> <!-- 该页面中的p标签样式也都被my.css文件控制 --> <p></p> <p></p> </body>总结行间式控制样式最直接,但是样式多了直接导致页面可读性变差,且样式相同的标签样式也需要各自设置,复用性差; 内联式可以用一套样式块同时控制多个标签,具有样式的复用性,但是css样式代码还是写在html文件中,在项目开发下,代码量剧增,导致html文件变得臃肿,不利于代码维护 外联式将css样式移到外部css文件中,不仅避免项目开发下html文件的臃肿问题,同时具有一套代码块控制多个标签,一个css样式文件服务于多个html两种复用性的好处,但是在学习阶段代码量不大时,样式不需要服务于多个html页面时,前面两种方式显然显得更便利。 在行间式中,写在标签内部的样式自然是用来控制该标签的样式,那写在内联式和外联式中的样式又是通过什么样的联系来控制对应页面中标签的样式呢?答案就是用于建立css与html之间联系的css选择器
2025年02月05日
6 阅读
0 评论
0 点赞
2025-02-05
HTML常用标签
一、文档声明 你可使用此声明在 Internet Explorer6 及以后版本中切换为严格的标准兼容模式。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html><!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title> abc </title> </head> <body> <!-- 这里是页面主体内容 --> </body> </html>二、主体结构<htm1></htm1>此元素可告知浏览器其自身是一个 HTML 文档。 <head></head>用于定义文档的头部,它是所有头部元素的容器。,<head>中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。 <body></doby>定义文档的主体三、HEAD头部标签<title></title>定义文档标题 <base />标签为页面上的所有链接规定默认地址或默认目标! 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。标签永远位于 head 元素内部。 <link></link>标签定义文档与外部资源的关系 <style></style>标签用于定义客户端脚本,比如JavaScript。script元素既可以包含脚本语句,也可以通过src属性指向外部脚本文件。四、meta元信息content 定义与 http-equiv 或 name 属性相关的元信息 name 把content属性关联到一个名称 author description keywords generator revised robots others http-equiv 把 content 属性关联到 HTTP 头部 content-type expires refresh set-cookie charset字符集编码 编码字符集 HTML5 支持 HTML5向下兼容 HTML 4支持 网页关键字: 网页描述信息 <!--下面的内容,只需要了解。 自己看看--> 所有搜索引擎,抓取这个页面、爬行链接、禁止快照: all:文件将被检索,且页面上的链接可以被查询; none:文件将不被检索,且页面上的链接不可以被查询; index:文件将被检索; follow:页面上的链接可以被查询; noindex:文件将不被检索,但页面上的链接可以被查询; nofollow:文件将被检索,但页面上的链接不可以被查询; noarchive:文件将被检索,但禁止保存快照; 网页作者: 网页网页生成工具 定义页面最新版本 网页版权信息: 网页刷新信息: 10秒后跳转到百度页面五、格式排版标签<br/>换行标签,完成文字的紧凑显示。可以使用连续多个<br/>标签来换行 <hr/>水平分割线标签,用于段落与段落之间的分割 <p></p>段落标签,里面可以加入文字,列表,表格等,可以<p></p>或<p />使用 <pre></pre>按原文显示标签,可以把原文件中的空格,回车,换行,tab键表现出来 <hn></hn>标题字标签,n为1-6,定义六级标题,而且会自动换行插入一个空行 <div></div>没有任何语义的标签六、文本标签<em></em>表示强调,通常为斜体字 <strong></strong>表示强调(语气更强),通常为粗体字<de1></de1>标签定义文档中已删除的文本 <insx</ins>标签定义已经被插入文档中的文本 <sub></sub>文字下标字体标签 <sup></sup>文字上标字体标签 <markx/mark> H5新增 标签定义带有记号的文本 请在需要突出显示文本时使用,如搜索 引擎搜索页面 <ruby></ruby> H5新增 标签定义 ruby 注释(中文注音或字符) 在东亚使用,显示的是东亚字符的发音。 <rt></rt>H5新增 标签定义字符(中文注音或字符)的解释或发音<!--一下文本标签 作为了解--> <cite> 用于引证、举例、(标签定义作品(比如书籍、歌曲、电影、电视节目、绘画、雕塑等等)的标题)通常为斜体字 <dfn> 定义一个定义项目 <code> 定义计算机代码文本 <samp> 定义样式文本 标签并不经常使用。只有在要从正常的上下文中将某些短字符序列提取出来,对它们加以强调的极少情况下,才使用这个标签。 <kbd> 定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。 <abbr> 定义缩写 配合title属性 (IE6以上) <bdo> 来覆盖默认的文本方向 dir属性 值: lrt rtl <var> 定义变量。您可以将此标签与 <pre> 及 <code> 标签配合使用。 <small> 标签定义小型文本(和旁注) <b> 粗体字标签 根据 HTML 5 的规范,<b> 标签应该做为最后的选择,只有在没有其他标记比较合适时才使用它。 <i> 斜体字标签 标签被用来表示科技术语、其他语种的成语俗语、想法、宇宙飞船的名字等等。 <u> 下划线字体标签 标签定义与常规文本风格不同的文本,像拼写错误的单词或者汉语中的专有名词。 请尽量避免使用 <u> 为文本加下划线,用户会把它混淆为一个超链接。 <q> 签定义一个短的引用。浏览器经常会在这种引用的周围插入引号。(小段文字) <blockquote> 标签定义摘自另一个源的块引用。浏览器通常会对 <blockquote> 元素进行缩进。(大段文字) (块状元素) <address> 定义地址 通常为斜体 (注意非通讯地址) 块状元素 <font> H5已删除 字体标签,可以通过标签的属性指定文字的大小、颜色及字体等信息 <tt> H5已删除 打字机文字 <big> H5已删除 大型字体标签 <strike> H5已删除 添加删除线 <acronym> H5已删除 首字母缩写 请使用<abbr>代替 <bdi> H5新增 标签允许您设置一段文本,使其脱离其父元素的文本方向设置。(经测试,各大浏览器都不起作用) <mark> H5新增 标签定义带有记号的文本 请在需要突出显示文本时使用,如搜索引擎搜索页面 <meter> H5新增 定义预定义范围的度量 <progress> H5新增 标签标示任务的进度(进程) <time> H5新增 定义时间和日期 <wbr> H5新增 规定在文本中的何处适合添加换行符。Word Break Opportunity
2025年02月05日
7 阅读
0 评论
0 点赞
2025-02-05
HTML5基础
一、HTML1.1 什么是HTMLHTML是用来制作网页的标记语言 HTML是Hypertext Markup Language的英文缩写,即超文本标记语言 HTML语言是一种标记语言,不需要编译,直接由浏览器执行 HTML文件是一个文本文件,包含了一些HTML元素,标签等 HTML文件必须使用.html或.htm为文件名后缀 HTML是大小写不敏感的,HTML与html是一样的 HTML是由W3C的维护的HTML 是通向 WEB 技术世界的钥匙。1.2发展历史HTML是从2.0版本开始的,实际上没有1.0的官方规范,在1993年6月作为互联网工程工作小组(IETF)工作草案发布(并非标准) HTML 2.0--1995年11月作为RFC 1866发布,在RFC 2854于2000年6月发布之后被宣布已经过时 HTML 3.2--1997年1月14日,W3C推荐标准 HTML 4.0--1997年12月18日,W3C推荐标准 HTML 4.01(微小改进)--1999年12月24日,W3C推荐标准 HTML5-2014年10月28日,W3C推荐标准1.3HTML5的由来HTML5草案的前身名为 Web Applications 1.0,于2004年被WHATWG提出,于2007年被W3C接纳,并成立了新的 HTML 工作团队。 HTML5 的第一份正式草案已于2008年1月22日公布。HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。 2012年12月17日,万维网联盟(W3C)正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。根据W3C的发言稿称:“HTML5是开放的Web网络平台的奠基石。 2013年5月6日, HTML 5.1正式草案公布。该规范定义了第五次重大版本,第一次要修订万维网的核心语言:超文本标记语言(HTML)。在这个版本中,新功能不断推出,以帮助Web应用程序的作者,努力提高新元素互操作性。 2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。1.4HTML5的优点1、提高可用性和改进用户的友好体验 2、有几个新的标签,这将有助于开发人员定义重要的内容 3、可以给站点带来更多的多媒体元素(视频和音频) 4、可以很好的替代FLASH和Silverlight 5、当涉及到网站的抓取和索引的时候,对于SEO很友好 6、将被大量应用于移动应用程序和游戏 7、可移植性好。1.5HTML5的兼容性Internet Explorer 9 以及 以上版本 chrome、Safari、opera、Firefox和各种以wekkit为内核的国产浏览器二、HTML基本语法2.1HTML标签标签是HTML中最基本单位,也是最重要组成部分 通常要用两个角括号括起来:<和> 标签都是闭合的(两种形式:成对与不成对) 双标签(成对):<标签名>内容</标签名>如:<table></table>即分起始和结束 单标签(不成对):<标签名 />;如:<br/>、<hr/> 标签是大小写无关的,body>;跟<B0DY>表示意思是一样的,标准推荐使用小写,这样符合XHTML标准 对于HTML标签来讲,最重要的是语义2.2HTML标签属性HTML属性一般都出现在HTML的开始标签中,是HTML标签的一部分。 标签可以有属性,它包含了额外的信息.属性的值一定要在双引号中。 标签可以拥有多个属性。 属性由属性名和值成对出现。 语法格式如下: <标签名 属性名1="属性值" 属性名2="属性值" ... 属性名N="属性值">2.3HTML代码格式任何回车或空格在源代码中都是不起作用,所以在编写HTML代码时,都可以使用回车或者空格进行代码排版这样可以使代码清晰,也便于团队合作。必须保持严格的缩进规则,以Tab键为准。2.4HTML注释<!-- 注释内容 --> <!-- 这里全是注释 都是注释 -->2.5HTML实体(特殊字符)
2025年02月05日
7 阅读
0 评论
0 点赞
2025-02-01
前端开发工具选择
一、安装Sbulimehttps://www.sublimetext.com/二、安装插件https://packagecontrol.io/ 打开Sublime Text 然后首选项里面有浏览插件目录 创建文件夹Package Control把下载好的文件放进去 重启Sublime Text三、安装插件1、在Sublime Text中使用快捷键 Ctrl+Shift+P (Windows/Linux) 或 Cmd+Shift+P (Mac) 打开命令面板。 2、在命令面板中开始输入“Package Control: Install Package”,然后从下拉列表中选择该项并按回车键。 Emmet:在随后出现的搜索框中输入“Emmet”,找到后点击即可自动安装。 SideBarEnhancements:重复上述过程,这次搜索“SideBarEnhancements”并安装。 Material Theme:同样地,搜索“Material Theme”进行安装。(UI: Select Theme”。然后从列表中选择你喜欢的Material Theme样式) #对于某些插件,你可能需要进一步配置才能完全满足你的需求。这通常可以通过访问Preferences -> Package Settings下的相关菜单来完成。 #退出任何功能界面:esc
2025年02月01日
5 阅读
0 评论
0 点赞
2025-01-28
GIt的分支管理
一、分支介绍分支是Git的杀手级特征,而且Git鼓励在工作流程中频繁使用分支与合并,哪怕一天之内进行许多次都没有关系。因为Git分支非常轻量级,不像其他的版本控制,创建分支意味着要把项目完整的拷贝一份,而Git创建分支是在瞬间完成的,而与你工程的复杂程度无关。二、创建分支与合并分支分支可以被理解为一条时间线,这一条时间线上串着一个个节点,每个节点都是一次提交记录/版本。 git默认只有一条时间线or分支,该时间线or分支称之为主分支,即master分支,文件.git/refs/heads/master 内存放着指向master分支最新版本的指针,如果下所示红色块即master指针,指向master分支 # 注意箭头方向,因为每一次提交都有一个指向上一次提交的指针,所以箭头方向向左,更为合理每次提交,master分支都会向前移动一步,master指针指向最新提交的一个版本,这样,随着你不断提交master分支的线也越来越长,如下如果我们有多个分支,那么GIT如何实现在多个分支之间来回切换的呢,·git文件夹下的HEAD文件负责存放当前所在的分支ref:refs/heads/分支名称》,切换分支就是修改HEAD文件中的内容为对应分支,并将工作区的文件恢复至对应分支的内容,所以严格来说HEAD不是指向提交,而是指向当前所在的分支,比如master,master才是指向提交的,一开始的时候,master分支是一条线,Git用master指向最新的提交,再用HEAD指向就能确定当前分支,以及当前分支的提交点:当我们创建并切换到一个新的分支,例如dev时 1、Git会新建一个指针叫dev,指向master相同的提交 2、然后再把HEAD指向dev,就表示当前分支在dev上 Git创建一个分支很快,因为除了增加一个dev指针,改改HEAD的指向,工作区的文件都没有任何变化如果HEAD指向dev,那么代表当前分支在dev上,这意味着接下来对工作的修改和提交都是针对dev分支了,如果master是小河的主干,那么dev就是这条河的支流,主干的水被引入了支流. 比如提交一次后,dev指针往后移动一步,而master指针不变当在master分支合并dev分支时,因为他们在一条线上,这种单线的历史分支不存在任何需要解决的分歧,所以只需要master指针指向dev分支的最新一次提交即可,所以非常快。所以你看,git不仅创建分支快,合并分支也很快!就改改指针,工作区内容也不变!合并完分支后,甚至可以删除dev分支。删除dev分支就是把dev指针给删掉,删掉后,我们就剩下了一条master分支,甚至都看不出来添加过dev分支,毁尸灭迹了实操:1、在当前分支下创建子分支并切换# 1.1 创建+切换=>两条命令搞定 git branch dev # 在当前分支下创建子分支 git checkout dev # 由当前分支切换到子分支 #1.2 创建+切换=>一条命令搞定 git checkout -b dev # 等同于上述两条命令,代表创建并切换到子分支2、直接切换到已有分支git checkout dev3、查看当前分支devmaster4、切换到dev分支下修改并提交记录/版本git checkout dev echo "111" > c.txt git add . git commit -m "v4" git checkout master git merge dev # git merge命令用于合并指定分支到当前分支。如果顺着一个分支走下去可以到达另一个分支的话,那么 Git 在合并两者时,只会简单地把指针右移因为这种单线的历史分支不存在任何需要解决的分歧,所以这种合并过程可以称为快进(Fastforward),上述合并git merge dev用的就是Fast-forward快进模式,毫无疑问不是每次合并都能采用Fast-forward。 合并完成后,就可以放心地删除dev分支了 $ git branch -d dev Deleted branch dev (was f1d9621). master因为创建、合并和删除分支非常快,所以Git鼓励你使用分支完成某个任务,合并后再删掉分支,这和直接在master分支上工作效果是一样的,但过程更安全。5、switch因为get checkout -- 文件通常是用来撤销修改的,又用它来创建并切换分支,有点容易让人混淆,所以 最新版本的Git提供了新的git switch命令来创建or切换分支,推荐使用 $ git switch -c dev # 创建并切换到新的dev分支,等同于git checkout -b dev $ git switch master # 直接切换到已有的master分支三、分支管理策略
2025年01月28日
5 阅读
0 评论
0 点赞
1
...
5
6
7
...
15