JavaWeb--前端--01HTML和CSS

news2024/10/6 18:24:15

文章目录

  • 1 前端开发介绍
  • 2 开发工具
  • 3 文档查阅
  • 4 CSS选择器
  • VSCode的插件

点击进入:W3School的HTML文档
点击进入:W3School的CSS文档
内容就在这两个网站里面

1 前端开发介绍

Web标准也称为网页标准,由一系列的标准组成,大部分由W3C( World Wide Web Consortium,万维网联盟)负责制定。由三个组成部分:

  • HTML:负责网页的结构(页面元素和内容)。

  • CSS:负责网页的表现(页面元素的外观、位置等页面样式,如:颜色、大小等)。

  • JavaScript:负责网页的行为(交互效果)。

前后端分离的开发模式
在这里插入图片描述

学习内容:
HTML、CSS、JavaScript
Vue、Element、Nginx
Maven
SpringBoot Web 基础篇
MySQL
SpringBoot Mybatis
SpringBoot Web开发篇
SpringBoot Web进阶篇

2 开发工具

Visual Studio Code(简称 VS Code )
点击下载 https://code.visualstudio.com/

建议以后安装所有与开发相关的软件,尽量安装在一个没有中文,不带空格的目录下。

3 文档查阅

点击进入:W3School的HTML文档
点击进入:W3School的CSS文档

在这两个网站好好学学吧

4 CSS选择器

1 元素(标签)选择器

  • 选择器的名字必须是标签的名字
  • 作用:选择器中的样式会作用于所有同名的标签上
元素名称 {
    css样式名:css样式值;
}

例如:

 div{
     color: red;
 }

2 id选择器

  • 选择器的名字前面需要加上#
  • 作用:选择器中的样式会作用于指定id的标签上,而且有且只有一个标签(由于id是唯一的)
#id属性值 {
    css样式名:css样式值;
}

例如:

#did {
    color: blue;
}

3 类选择器

  • 选择器的名字前面需要加上 .
  • 作用:选择器中的样式会作用于所有class的属性值和该名字一样的标签上,可以是多个
.class属性值 {
    css样式名:css样式值;
}
.cls{
     color: green;
 }

VSCode的插件

VSCode插件名称功能
Chinese (Simplified) Language Pack汉化
Code Spell Checker拼写检查器
HTML CSS Support自动补全CSS样式表代码
JavaScript (ES6) code snippets支持ES6语法提示
Mithril Emmet补全代码
Path Intellisense路径提示插件
Vue 3 Snippets提供代码片段,语法高亮和格式化
VueHelper代码提示插件
Auto Close Tag自动闭合HTML/XML标签
Auto Rename Tag自动完成另一侧标签的同步修改
Beautify格式化 html ,js,css
Bracket Pair Colorizer给括号加上不同的颜色
open in browser快速在浏览器中打开html文件
VeturVue多功能集成插件
File UtilsFile Utils插件,可以方便快捷的来创建、复制、移动、重命名文件和目录。
IntelliJ IDEA Keybindings安装VSCode的插件 IntelliJ IDEA Keybindings 即可在VSCode中使用IDEA的快捷键。

在这里插入图片描述
在这里插入图片描述

沉头侧畔千帆过,病树前头万木春。

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

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

相关文章

ArcGIS加载的各类地图怎么去除服务署名水印

昨天介绍的: 一套图源搞定!清新规划底图、影像图、境界、海洋、地形阴影图、导航图-CSDN博客文章浏览阅读373次,点赞7次,收藏11次。一体化集成在一起的各类型图源,比如包括影像、清新的出图底图、地形、地图阴影、道路…

定制k8s域名解析------CoreDns配置实验

定制k8s域名解析------CoreDns配置实验 1. 需求 k8s集群内通过CoreDns互相解析service名. 同时pana.cn域为外部dns解析,需要通过指定dns服务器进行解析 再有3个服务器,需要使用A记录进行解析 2. K8s外DNS服务器 查看解析文件 tail -3 /var/named/pana.cn.zone 解析内容 ww…

error: failed to push some refs to ‘https://gitee.com/zhao-zhimin12/gk.git‘

git push origin master发现以下报错: 解决办法: 一、强制推送 git push origin master -f (加上 -f 就是强制) 二、 先拉取最新代码,再推送 1.git pull origin master 2.git push origin master

11.基础乐理-音域、1=C到底是那一组的C

音域: 音域它指的是一个乐器(包括人声),能发出的所有的音高总,比如我们拿钢琴来看,钢琴最低的是大字二组的A2, 钢琴最高音是小字五组的c5,钢琴的音域是A2 - c5,如图1所示…

接口测试——postman

一.下载与安装 https://www.getPostman.com/ 界面导航说明 二.get请求 第一个get请求 批量执行接口请求: 1. 右击run collection 2. 会出现runner标签页 携带参数的GET请求 所谓的查询参数,其实就是URL地址中问号(?)后面的部分…

解决这个设备,搞安防网络不再踩坑!

中午好,我的网工朋友。 随着安全防护领域从模拟技术向IP技术的转型,网络在安防的应用越来越重要,也越来越复杂。 从业多年,我观察到许多行业同仁在技术实践中走了弯路,无论是安防厂商、集成商还是最终用户&#xff0…

C语言 | Leetcode C语言题解之第25题K个一组翻转链表

题目: 题解: /* 定义保存两个地址的结构体* 用来保存反转后结果的头节点和尾节点*/ typedef struct {struct ListNode* head; struct ListNode* tail; } TwoAddress; // 反转中间链表 TwoAddress* reverse(struct ListNode* head){struct ListNode* pr…

7 种实现 CSS 三角形的原理与方法 以及 三角形在网页设计中的作用

三角形在网页设计中不仅是图形设计的基本元素,更是实现视觉引导、空间构建、情绪传达、品牌塑造、性能优化以及创新表达的重要工具。其广泛应用和多功能性使其成为设计师手中不可或缺的设计语言组成部分。本文介绍了7种CSS实现三角形的方法。 CSS实现三角形主要有以…

基于java+springboot+vue实现的健身俱乐部系统(文末源码+Lw+ppt)23-49

摘 要 随着社会的发展,健身俱乐部的管理形势越来越严峻。越来越多的用户利用互联网获得信息,健身信息鱼龙混杂,信息真假难以辨别。为了方便用户更好的获得本健身俱乐部管理信息,因此,设计一种安全高效的健身俱乐部网…

护眼大路灯十大排名品牌有哪些?护眼落地灯排行榜新鲜出炉!

作为一位电器测评博主,我的后台总会有人不断询问关于大路灯的问题。我大概汇总了一下,常见的就是护眼大路灯哪款好,护眼大路灯十大排名品牌有哪些等等,这些问题的存在主要是因为市面上存在着众多的大路灯品牌,质量参差…

【LeetCode刷题记录】54. 螺旋矩阵

54 螺旋矩阵 给你一个 m 行 n 列的矩阵 matrix ,请按照 顺时针螺旋顺序 ,返回矩阵中的所有元素。 示例 1: 输入:matrix [[1,2,3],[4,5,6],[7,8,9]] 输出:[1,2,3,6,9,8,7,4,5] 示例 2: 输入&#xf…

目标检测——食品饮料数据集

一、重要性及意义 对食品和饮料进行目标检测的重要性和意义体现在多个方面: 商业应用与市场分析:目标检测技术在食品和饮料行业有着广泛的应用前景。通过对超市货架、餐馆菜单或广告海报中的食品和饮料进行自动识别和计数,商家可以获取关于产…

MongoDB的安装配置及使用

文章目录 前言一、MongoDB的下载、安装、配置二、检验MongoDB是否安装成功三、Navicat 操作MongoDB四、创建一个集合,存放三个文档总结 前言 本文内容: 💫 MongoDB的下载、安装、配置 💫 检验MongoDB是否安装成功 ❤️ Navicat 操…

【计算机毕业设计】基于微信小程序的开发项目150套(附源码+演示视频+LW)

大家好!我是程序猿老A,感谢您阅读本文,欢迎一键三连哦。 🧡今天给大家分享200的微信小程序毕业设计,后台用Java开发,这些项目都经过精心挑选,涵盖了不同的实战主题和用例,可做毕业设…

【计算机毕业设计】家庭食谱管理系统产品功能介绍——后附源码

🎉**欢迎来到琛哥的技术世界!**🎉 📘 博主小档案: 琛哥,一名来自世界500强的资深程序猿,毕业于国内知名985高校。 🔧 技术专长: 琛哥在深度学习任务中展现出卓越的能力&a…

Java面试八股文(JVM篇)(❤❤)

Java面试八股文_JVM篇 1、知识点汇总2、知识点详解:3、说说类加载与卸载11、说说Java对象创建过程12、知道类的生命周期吗?14、如何判断对象可以被回收?17、调优命令有哪些?18、常见调优工具有哪些20、你知道哪些JVM性能调优参数&…

简单的网站-表白墙(前后端交互)

提交信息后,就得到了下面的一行话 但是存在一些问题 在一个网站中,服务器起到的最主要的效果,就是 “存储数据” 因此服务器这边往往也就需要能够提供两种风格的接口。存数据 、取数据 二、实现前后端交互 1)先规定此处请求和响…

【多模态+数据集】LLaVa1.5训练数据集解析(用于参考制作自己数据集)

LLaVa 家族 (Large Language and Vision Assistant ) 代码: https://github.com/haotian-liu/LLaVA LLaVA-1.5论文: 23.10.Improved Baselines with Visual Instruction Tuning LLaVA-1.5论文解析:https://blog.csdn.net/imwaters/article/d…

微前端 qiankun 框架接入问题记录

背景:需要搭建一个平台,这个平台的主要功能是集成各个子系统,方面对系统之间的统一管理。在搭建这样一个平台时,前端考虑使用微前端架构方式实现,使用的框架是 qiankun,本文主要记录在 qiankun 框架使用过程…

PDF文档电子签名怎么做?

如何确保电子文档的签署具有公信力和法律效力,防止伪造和假冒签名等问题,是电子文档无纸化应用面临的重要挑战。本文将详细介绍PDF文档电子签名的概念、重要性、实施步骤以及相关的法律背景,帮助用户理解并有效应用PDF文档电子签名技术。 1.…