我的前端笔记

news2024/11/10 17:02:16

HTML

./当前文件夹

../返回上一级

../../返回上上级

如果点击链接需要在新标签中打开<a href="#" target="_blank">

网页中音频和视频都是默认不会自动播放的,视频得配合muted(静音)和autoplay配合使用

无语义标签:div独占一行、span不换行

列表:无序ul、有序ol、自定义dl(dt、dd)

表格:table(tr、td/dd)(rowspan、colspan)表头表身表尾不能跨行合并

表单:上传数据用的;【下面的表单用form包裹】

        1.input(text、password、radio(单选)【audio音频、video视频】、checkbox(多选)、file)

        2.下拉菜单:select嵌套option

        3.文本域:textarea

        4.label(用来增大点击范围,用户点击文字光标即可指定内容)有两种写法

        5.按钮:button属性type(submit提交、reset需要配合form使用、button这个结合js使用)

无语义标签:就是用来规划网页结构的。div独占一行、span不换行

CSS

css的引入方式(内部、外部、行内:行内用标签的属性style)

选择器

        标签选择器(不能多选)

        类选择器(可多选,用class类)

        id选择器(得配合js使用)

        通配符选择器(*{ }一般用于清楚网页的默认样式)

 盒子

        宽高背景色

文字(浏览器默认字体大小为16px,下面的css功能可以用于清除字体的默认样式)

        font-weight(400为正常,700为加粗)

        font-style(normal/italic)

        

        行高如果是数字代表字体的倍数,行高可以使文字在盒子居中,行高和盒子高度一致(但换行之后就不行,不过一般都是单行的文字)

        家族名称复制tb或jd的官网就行(12px/1.5 tahoma, arial, 'Hiragino Sans GB', '\5b8b\4f53', sans-serif;)

        font一般用于网页文字公共样式

        

        文本缩进,属性用em,1em等于1倍字体的宽度

        text-align,用于文字或图片居中都可以,用div独占一整行包裹

        

               

        

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1132835.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Peter算法小课堂—球盒问题

球盒问题有8类&#xff0c;分别如下图 相同的球放入相同的盒子 根据上一篇Peter算法小课堂—正整数拆分-CSDN博客 简单来说&#xff0c;就这样&#x1f447; 将相同的球放入相同的盒子&#xff0c;其实相当于将正整数i分为j个正整数的个数 cin>>n>>m; if(n<…

Java|学习|多线程

1.多线程的一些概念 进程&#xff1a;是正在运行的程序 是系统进行资源分配和调用的独立单位 每一个进程都有它自己的内存空间和系统资源。 线程&#xff1a;是进程中的单个顺序控制流&#xff0c;是一条执行路径。 单线程&#xff1a;一个进程如果只有一条执行路径&#xff0…

前端,CSS,背景颜色跟随轮播图片改变而改变(附源码)

首先看效果&#xff01; 比如轮播图时红色&#xff0c;那么背景的底色也是红色&#xff0c;轮播图时黄色&#xff0c;背景的底色也是黄色&#xff0c;这就是根据轮播图的图片切换&#xff0c;而改变背景颜色随轮播图颜色一致 话不多说&#xff0c;直接上代码&#xff01;非常简…

Linux系统编程学习 NO.8 ——make和Makefile、进度条程序

前言 今天是1024程序员节&#xff0c;不知不觉离第一次写博客已经过去了一年了。在此祝各位程序员不写bug&#xff0c;不再秃头。 make和Makefile 什么是make和Makefile&#xff1f; make和Makefile是软件开发时所用到的工具和文件。make是一个指令工具。Makefile是一个当前…

避雷!新增2本期刊被标记为「On Hold」,1区TOP刊仍在调查中!

近期小编在Master Journal List上查询期刊时偶然发现&#xff0c;又有2本期刊被科睿唯安标记为「On Hold」&#xff01; 这2本期刊分别为MIGRATION LETTERS和REVISTA DE GESTAO E SECRETARIADO-GESEC. 此外还有6本期刊被标记为「On Hold」&#xff0c;目前共计8本期刊被「On …

Fedora系统的部署与MobaXterm的使用

Fedora Fedora简介 Fedora&#xff0c;Fedora Linux&#xff08;第七版以前为Fedora Core&#xff09;是由Fedora项目社区开发、红帽公司赞助&#xff0c;目标是创建一套新颖、多功能并且自由&#xff08;开放源代码&#xff09;的操作系统。Fedora是商业化的Red Hat Enterpr…

Bwapp靶场下载安装

bwapp安装 bWAPP&#xff08;Buggy Web Application&#xff09;是一个用于学习和测试Web应用程序安全的漏洞性Web应用程序。bWAPP通过提供多种常见Web应用程序漏洞&#xff08;例如跨站点脚本&#xff08;XSS&#xff09;、SQL注入、文件包含等&#xff09;来帮助用户了解和熟…

可观察性支柱:探索日志、指标和跟踪

通过检查系统输出来测量系统内部状态的能力称为可观察性。当可以仅使用输出信息&#xff08;即传感器数据&#xff09;来估计当前状态时&#xff0c;系统就变得“可观察”。您可以使用来自 Observability 的数据来识别和解决问题、优化性能并提高安全性。 在接下来的几节中&am…

幸狐LuckFox Pico RV1103微型Linux开发板 上手教程分享—02:SDK 环境部署

续上01教程分享&#xff0c;今天主要分享Luckfox Pico SDK 的环境部署 LuckfoxPico-SDK是基于Ubuntu LTS 系统开发测试的&#xff0c;在开发过程中&#xff0c;主要是用Ubuntu 18.04版本&#xff0c; 为了不必要的麻烦&#xff0c;我们推荐用户使用…

别再吹 GPT-4V 了!连北京烤鸭都不认识,你敢信??

夕小瑶科技说 原创 作者 | 智商掉了一地、ZenMoore GPT-4 被吹的神乎其神&#xff0c;作为具备视觉能力的 GPT-4 版本——GPT-4V&#xff0c;也被大众寄于了厚望。但如果告诉你&#xff0c;GPT-4V 连图片上的“北京烤鸭”和“广西烤鸭”都分不清楚&#xff0c;你是否觉得大跌眼…

电子邮件发送接收原理(附 go 语言实现发送邮件)

前言 首先要了解电子邮件的发送接收&#xff0c;不是点到点的。我想给你传达个消息&#xff0c;不是直接我跑到你家里喊你&#xff1a;“嘿&#xff0c;xxx&#xff0c;是你的益达&#xff0c;快拿走”。 而是类似快递的发送收取方式&#xff0c;是有服务器的中转的。我先将我…

1个月5次发版:测试人的模块测试策略分类归纳

笔者所在项目经历了一个月开发周期&#xff0c;该项目有5名开发人员&#xff0c;1名项目经理&#xff0c;1名测试人员&#xff0c;涵盖OA系统8个模块&#xff0c;在短短1个月中进行了5次发布。 现进行模块测试策略分类归纳。 已有模块 配置项优化 对于已有模块的配置项优化&…

【Python】collections.Counter

Python内置模块collections中的Counter是字典子类。Counter不是字典&#xff0c;但很像字典。 Counter具有字典的键和值&#xff0c;键是各个元素&#xff0c;值为该元素出现的次数。 Counter相当于计数器。常用于哈希映射&#xff08;哈希表&#xff09;。 from collection…

Unity Inspector编辑器扩展,枚举显示中文,枚举值自定义显示内容

记录&#xff01;Unity Inspector面板编辑器扩展&#xff0c;枚举显示中文&#xff0c;枚举值自定义显示内容&#xff0c;显示部分选项。效果如下&#xff1a; 枚举类代码&#xff1a; using System.Collections; using System.Collections.Generic; using UnityEngine;public…

从顺序表表中删除具有最小值的元素(假设不唯一)并由函数返回被删元素值

从顺序表表中删除具有最小值的元素&#xff08;假设不唯一&#xff09;&#xff0c;并由函数返回被删元素值 空出的位置由最后一个元素填补&#xff0c;若顺序表为空&#xff0c;则显示出错误信息并退出运行 //顺序表定义及初始化 #define _CRT_SECURE_NO_WARNINGS #include&l…

SpringMVC Day 01:入门案例

前言 在我们的日常工作和学习中&#xff0c;Web 开发是一个无法回避的重要环节。而在 Java Web 开发领域&#xff0c;SpringMVC 无疑是一个重量级选手。它以其灵活性、强大功能和清晰的 MVC 结构&#xff0c;赢得了大量开发者的青睐。但是&#xff0c;对于初学者来说&#xff…

云表:【建议收藏】什么是低代码?一分钟掌握低代码开发

IT圈的风口总是轮番上演&#xff0c;但只有在浪潮退去后&#xff0c;真正具有社会价值的产品才能脱颖而出。同样地&#xff0c;这个规则也适用于“低代码”这个赛道。 云表平台认为&#xff0c;低代码将成为未来企业数字化转型中不可或缺的重要元素之一。随着市场竞争的不断加剧…

Qt 窗口的尺寸

本文通过多个案例&#xff0c;详细说明关于Qt窗体尺寸的一些重要问题 默认尺寸 对于一个Qt的窗口&#xff08;继承于QWidget&#xff09;&#xff0c;获取其窗体尺寸的方法size()&#xff1b; 以一个Qt创建Qt Widgets Application项目的默认生成代码为基础&#xff0c;做如下…

安科瑞电能计量管理系统

安科瑞 崔丽洁 随着国家电网改革政策的逐步推进和落实&#xff0c;Acrel-3000WEB电能管理解决方案运用互联网和大数据技术&#xff0c;为电力运维公司提供电能管理解决方案。该平台作为连接运维单位和用电企业的纽带&#xff0c;全方面监视用户配电系统的运行状态和电量数据&am…

分享一款基于 AI 的 Chrome 插件

最近使用大模型比较多&#xff0c;公司虽然提供了免费的 ChatGPT 但是需要跳转特定页面才能访问&#xff0c;比较麻烦&#xff0c;于是就想到是否可以开发一款类似于有道词典一样的 Chrome 插件&#xff0c;可以在任意页面使用&#xff0c;虽然市面上也有类似的插件&#xff0c…