前端笔记-day1

news2024/9/22 11:26:44

文章目录

    • 01-标签的写法
    • 02-HTML的基本骨架
    • 03-标签的关系
    • 04-注释
    • 05-标题标签
    • 06-段落标签
    • 07-换行与水平线标签
    • 08-文本格式化标签
    • 09-图像的基本使用
    • 10-图像的属性
    • 12-绝对路径
    • 13-超链接
    • 14-音频
    • 15-视频标签
    • 16-招聘案例
    • 18-个人简历
    • 19-vue简介

01-标签的写法

<strong>文字内容</strong>
<hr>

02-HTML的基本骨架

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网页标题</title>
</head>
<body>
    给用户看的，能看见吗？
</body>
</html>

03-标签的关系

父子关系
兄弟关系

04-注释

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- AKLJKFNKLSACKCKKnKknknknkNKkNkn没那么 -->
    <strong>zhegskfj</strong>
</body>
</html>

05-标题标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>一级标题</h1>
    <h2>jfn</h2>
    <h3>jfj</h3>
    <h4>sjfnkj</h4>
    <h5>fj</h5>
    <h6>djsb</h6>
</body>
</html>

06-段落标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p>
    <p>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p>
    <p>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p>
   
</body>
</html>

07-换行与水平线标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    第一行<br><br>
    第二行<br><br>
    <hr>
</body>
</html>

08-文本格式化标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <strong>jiacu</strong> <br>
    <b>kshf</b>

    <br>
    <em>jhcsjd</em>
    <i>ckjnc</i>
    <br>
    <ins>ncjksdnc</ins>
    <u>xiahuaxian</u>
    <br>
    <del>shanchu</del>
    <s>shanchu</s>
</body>
</html>

09-图像的基本使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <img src="./1111.jpg" >
    <img src="./22222.jpg" alt="">
</body>
</html>

10-图像的属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <img src="./2222.jpg" alt="黑大衣">
    <img src="./1111.jpg" title="这是院人">
    <img src="./22222.jpg" width="100">
    <img src="./1111.jpg" height="300">
</body>
</html>

12-绝对路径

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <img src="D:/anaconda/JupyterNotebook/images/bird_small.png" alt="">
    <img src="https://t9.baidu.com/it/u=1541335328,1353667972&fm=3035&app=3035&size=f242,150&n=0&f=JPEG&fmt=auto?s=23540B6E2BF0A8CE195C11190000E0C1&sec=1713891600&t=09ab085029a1e66d280228fc2e80a68a" alt="">
</body>
</html>

13-超链接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>超链接</title>
</head>
<body>
    <!-- 跳转到本地文件：相对路径查找 -->
    <!-- target="_blank" 新窗口跳转页面 -->
    <a href="https://www.baidu.com">百度</a>
    <a href="./01-标签的写法.html" target="_blank">01标签写法</a>
    <!-- 开发初期，不知道超链接的地址，href属性值写# 表示她的空连接，不会跳转 -->
    <a href="#">空链接</a>
</body>
</html>

14-音频

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 在HTML5里面，如果属性名和属性值完全一样，可以简写为一个单词 -->
    <audio src="./media/music.mp3" controls loop autoplay></audio>
    <!-- controls:显示播放的控件 loop:循环播放 autoplay:自动播放-->
</body>
</html>

15-视频标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>视频标签</title>
</head>
<body>
    <video src="./media/video.mp4" controls loop muted autoplay></video>
    <!-- controls:显示播放的控件 loop:循环播放 autoplay:自动播放（必须添加muted） muted:静音播放-->

</body>
</html>

16-招聘案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>01-案例综合案例1-招聘案例</title>
</head>
<body>
   <h1>腾讯科技高级web前端开发岗位</h1> 
   <hr>
   
   <h2>职位描述</h2>
   <p>负责重点项目的前端技术方案和架构的研发和维护工作；</p>

   <h2>岗位要求</h2>
   <p>
        5年以上前端开发经验，
        <strong>精通html5/css3/javascript等</strong>
        web开发技术；<br>
    </p>
    <p>
        熟悉bootstrap，vue，angularjs，reactjs等框架，熟练掌握一种以上；
    </p>

    <p>
        代码⻛格严谨，能⾼保真还原设计稿，能兼容各种浏览器；
    </p>

    <p>
        对web前端的性能优化以及web常见漏洞有一定的理解和相关实践；
    </p>

    <p>
        具备良好的分析解决问题能力，能独立承担任务，有开发进度把控能力；
    </p>
    <p>
        责任心强，思路路清晰，抗压能力好，具备良好的对外沟通和团队协作能力。
    </p>

    <h2>工作地址</h2>
    <p>上海市-徐汇区-腾云大厦</p>

    <img src="./image.png" alt="">
</body>
</html>

在这里插入图片描述

18-个人简历

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人简历</title>
</head>
<body>
    <h1>乔亚康</h1>
    <hr>
    <p>巨大化BJCJCMN ，。。。， <a href="./01-标签的写法.html" target="_blank">HTML5</a></p>
    <img src="./33333.jpg" alt="">
    <h2>学习经历</h2>
    <p>就你上次你看</p>
    <h2>主要成就</h2>
    <p>jnjsdhbc
        <strong>大学专业是计算机专业</strong>
        变成精神病的持久化
        <em>开启了自己的前端生涯</em>
        <br>
        <p>dcnknk </p>
    </p>
    <h2>社会任职</h2>
    <p>女性角色本场比赛</p>

</body>
</html>

19-vue简介

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>Vue.js</h1>
    <p>dsjbvbvjb mcnb                 b hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
    <br>
    <p>其作者是
        <a href="./个人简历.html" target="_blank">刘雨欣</a>
    </p>

    <h2>主要功能</h2>
    <p>此技术的集成技术成就jhhhhhhhhhhhhhhhhhhhhhhhhhkkkkkkkkkkscnnnnn</p>
    <br>
    <p>bcjs cm mcksjnkcsdkckkkkkkkkk</p>
    <br>
    <p>cmjnvnnkvvkfkfk</p>

    <video src="./video.mp4" controls></video>



</body>
</html>

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

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

相关文章

LabVIEW开发MOOG控制系统数据处理软件

LabVIEW开发MOOG控制系统数据处理软件

LabVIEW开发MOOG控制系统数据处理软件 在现代航空领域&#xff0c;飞机结构的静强度试验是保证飞机安全运行的关键环节。MOOG加载控制系统作为试验中的关键设备&#xff0c;其数据输出的直观性和易处理性对于提高试验效率具有重要意义。设计了一种基于LabVIEW的MOOG控制系统数…
阅读更多...
##15 探索高级数据增强技术以提高模型泛化能力

##15 探索高级数据增强技术以提高模型泛化能力

文章目录 前言数据增强的重要性常见的数据增强技术高级数据增强技术在PyTorch中实现数据增强结论 前言 在深度学习领域&#xff0c;数据增强是一种有效的技术&#xff0c;它可以通过在原始数据上应用一系列变换来生成新的训练样本&#xff0c;从而增加数据的多样性&#xff0c…
阅读更多...
Redis过期删除策略和内存淘汰策略有什么区别？

Redis过期删除策略和内存淘汰策略有什么区别？

Redis过期删除策略和内存淘汰策略有什么区别&#xff1f; 前言过期删除策略如何设置过期时间&#xff1f;如何判定 key 已过期了&#xff1f;过期删除策略有哪些&#xff1f;Redis 过期删除策略是什么&#xff1f; 内存淘汰策略如何设置 Redis 最大运行内存&#xff1f;Redis 内…
阅读更多...
ADS基础介绍篇1

ADS基础介绍篇1

一. ADS简介 常用的射频仿真软件有ADS和AWR&#xff0c;ADS(Advanced Design system)最传统&#xff0c;是Agilent公司于2008年推出的电磁场仿真器&#xff0c;可提供原理图设计和layout版图设计。仿真功能十分强大&#xff0c;可提供从无源到有源&#xff0c;从直流到交流&am…
阅读更多...
算法提高之矩阵距离

算法提高之矩阵距离

算法提高之矩阵距离 核心思想&#xff1a;多源bfs 从多个源头做bfs&#xff0c;求距离 先把所有1的坐标存入队列 再把所有1连接的位置存入 一层一层求 #include <iostream>#include <cstring>#include <algorithm>using namespace std;const int N 1…
阅读更多...
关于画图-一次性搞定各类高级论文作图及配色

关于画图-一次性搞定各类高级论文作图及配色

关于画图-一次性搞定各类高级论文作图及配色 图&#xff08;Figure&#xff09;可以让各类论文的结果更加直观&#xff0c;有时候一张图片比一大段文字更有说服力。 但许多新手作者可能会有一连串的疑惑&#xff1a;数据这么多&#xff0c;什么时候该做什么类型的图&#xff…
阅读更多...
NASA数据集——2002-2011年全球18.7 至 89.0 千兆赫的亮度温度、海冰浓度和海冰积雪深度三级网格产品（AE_SI12）数据

NASA数据集——2002-2011年全球18.7 至 89.0 千兆赫的亮度温度、海冰浓度和海冰积雪深度三级网格产品（AE_SI12）数据

AMSR-E/Aqua Daily L3 12.5 km Brightness Temperature, Sea Ice Concentration, & Snow Depth Polar Grids V003 三级网格产品&#xff08;AE_SI12&#xff09;包括 18.7 至 89.0 千兆赫的亮度温度、海冰浓度和海冰积雪深度。 简介 美国国家航空航天局地球观测系统 Aqu…
阅读更多...
##16 利用迁移学习和微调提升深度学习模型性能

##16 利用迁移学习和微调提升深度学习模型性能

文章目录 前言什么是迁移学习&#xff1f;迁移学习的主要优势迁移学习的策略1. 特征提取器2. 微调 在PyTorch中实现迁移学习环境设置加载预训练模型修改模型以适应新任务训练和微调模型迁移学习的示例应用 结论 前言 在深度学习的多个领域中&#xff0c;迁移学习技术已经成为了…
阅读更多...
现代信号处理9_正则化（CSDN_20240512）

现代信号处理9_正则化（CSDN_20240512）

正则化的引入 解线性方程组&#xff1a; 这项工作有很多种做法&#xff0c;下面介绍两种&#xff0c;如下图所示&#xff0c;有一些数据点需要拟合&#xff0c;拟合的方法有很多。 1&#xff09; 构造线性函数①&#xff0c;这种函数比较简单&#xff0c;此时 2&#xff09; 构…
阅读更多...
信息系统项目管理师0102：可行性研究的内容（7项目立项管理—7.2项目可行性研究—7.2.1可行性研究的内容）

信息系统项目管理师0102：可行性研究的内容（7项目立项管理—7.2项目可行性研究—7.2.1可行性研究的内容）

点击查看专栏目录 文章目录 7.2项目可行性研究7.2.1可行性研究的内容1.技术可行性分析2.经济可行性分析3.社会效益可行性分析4.运行环境可行性分析5.其他方面的可行性分析记忆要点总结7.2项目可行性研究 可行性研究是在项目建议书被批准后，从技术、经济、社会和人员等方面的条…
阅读更多...
46 udp网络程序

46 udp网络程序

查询网络服务的命令 netstat -nlup n: 显示数字 a&#xff1a;显示所有 u&#xff1a;udp服务 p&#xff1a;显示pid Recv-Q收到的数量&#xff0c;本地ip和远端ip&#xff0c;00表示可以收到任何地址 网络聊天 服务端 定义一个server类&#xff0c;成员保存ip地址&#xff…
阅读更多...
JAVA毕业设计138—基于Java+Springboot+Vue的医院预约挂号小程序(源代码+数据库)

JAVA毕业设计138—基于Java+Springboot+Vue的医院预约挂号小程序(源代码+数据库)

毕设所有选题&#xff1a; https://blog.csdn.net/2303_76227485/article/details/131104075 基于JavaSpringbootVue的医院预约挂号小程序(源代码数据库)138 一、系统介绍 本系统前后端分离带小程序和后台 小程序&#xff08;用户端&#xff09;&#xff0c;后台管理系统&a…
阅读更多...
SQLite性能测试（插入）

SQLite性能测试（插入）

最近一直在思考一个问题&#xff0c;SQLite 做到这么轻量级&#xff0c;那它注定不会像 MySql 一样强性能&#xff0c;那么它的性能怎么样呢&#xff1f;并发量多高呢&#xff1f; 官方解释&#xff1a; About SQLite 最大数据库大小&#xff1a;281TB 最大行大小&#xff1…
阅读更多...
LVDS 接口标准和规范

LVDS 接口标准和规范

低压差分信号具有传输速率快、抗干扰性强的特点&#xff0c;是现在广泛应用的数据接口标准之一。Xilinx FPGA支持LVDS电平标准&#xff0c;并提供了动态相位调整解决方案&#xff0c;解决了基于LVDS源同步传输时存在的数据偏斜问题。 1 LVDS 技术规范简介 随着接口和背板信号…
阅读更多...
最新巨量X-Bogus、_signature参数逆向分析与算法还原

最新巨量X-Bogus、_signature参数逆向分析与算法还原

文章目录 1. 写在前面2. 接口分析3. 断点分析4. 扣代码补环境5. 数据解密 【&#x1f3e0;作者主页】&#xff1a;吴秋霖 【&#x1f4bc;作者介绍】&#xff1a;擅长爬虫与JS加密逆向分析&#xff01;Python领域优质创作者、CSDN博客专家、阿里云博客专家、华为云享专家。一路…
阅读更多...
BGP(border gateway protocol)边界网关协议初识篇

BGP(border gateway protocol)边界网关协议初识篇

BGP它是一种路径矢量协议&#xff0c;用于决定数据包在互联网中的最佳路径。 1、工作原理&#xff1a; 自治系统&#xff08;AS&#xff09;间路由: BGP主要用于连接不同自治系统之间的路由器&#xff0c;其中每个自治系统&#xff08;AS&#xff09;代表一组具有共同路由的网…
阅读更多...
【MySQL】基本操作

【MySQL】基本操作

欢迎来到Cefler的博客&#x1f601; &#x1f54c;博客主页&#xff1a;折纸花满衣 &#x1f3e0;个人专栏&#xff1a;MySQL 目录 &#x1f449;&#x1f3fb;创建和删除数据库&#x1f449;&#x1f3fb;数据库编码集和数据库校验集校验规则对数据库的影响 &#x1f449;&…
阅读更多...
如何在matlab时间序列中X轴标注月-日

如何在matlab时间序列中X轴标注月-日

一般我们使用的时间序列都是以年为单位&#xff0c;比如下图&#xff1a; 而如果要绘制月尺度的时间变化图&#xff0c;则需要调整X轴的标注。下面代码展示了如何绘制小时尺度的降水数据。 [sname2,lon2,lat2] kml2xy(GZ_.kml); nc_bound2 [lon2,lat2]; area_ind2inpolygon(e…
阅读更多...
Remix Client/Server 架构

Remix Client/Server 架构

Remix 框架是服务端渲染架构&#xff0c;当路由请求时生成 HTML 并返回浏览器。这种 SSR 是如何实现的呢&#xff1f;如果不使用 Remix 这种框架&#xff0c;可以在服务器段启动一个无头浏览器进行页面渲染并返回&#xff0c;代价就是要在服务器上启动一个 Chrome 服务&#xf…
阅读更多...
AI语音模型PaddleSpeech踩坑（安装）指南

AI语音模型PaddleSpeech踩坑（安装）指南

PaddleSpeech简介 PaddleSpeech 是基于飞桨 PaddlePaddle 的语音方向的开源模型库&#xff0c;用于语音和音频中的各种关键任务的开发&#xff0c;包含大量基于深度学习前沿和有影响力的模型。 PaddleSpeech安装步骤 提示&#xff1a;要找到一个合适的PaddleSpeech版本与pad…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023