首页
导航
统计
留言
更多
壁纸
直播
关于
推荐
星的导航页
星的云盘
谷歌一下
腾讯视频
Search
1
Ubuntu安装 kubeadm 部署k8s 1.30
108 阅读
2
kubeadm 部署k8s 1.30
81 阅读
3
rockylinux 9.3详细安装drbd+keepalived
79 阅读
4
rockylinux 9.3详细安装drbd
74 阅读
5
ceshi
54 阅读
默认分类
日记
linux
docker
k8s
ELK
Jenkins
Grafana
Harbor
Prometheus
Cepf
k8s安装
golang
Git
Python
Web开发
HTML和CSS
JavaScript
对象模型
登录
/
注册
Search
标签搜索
k8s
linux
docker
drbd+keepalivde
ansible
dcoker
webhook
星
累计撰写
61
篇文章
累计收到
55
条评论
首页
栏目
默认分类
日记
linux
docker
k8s
ELK
Jenkins
Grafana
Harbor
Prometheus
Cepf
k8s安装
golang
Git
Python
Web开发
HTML和CSS
JavaScript
对象模型
页面
导航
统计
留言
壁纸
直播
关于
推荐
星的导航页
星的云盘
谷歌一下
腾讯视频
搜索到
14
篇与
的结果
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日
5 阅读
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日
4 阅读
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日
4 阅读
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日
2 阅读
0 评论
0 点赞
1
2
3