前端零基础学习Day-Five

news2024/11/8 4:04:20

CSS

  • CSS层叠样式表(Cascading Style Sheets)

  • 用于定义HTML内容在浏览器内的显示样式

  • CSS简化HTML相关标签,网页体积小,下载快

  • 解决内容与表现分离的问题

  • 更好地维护网页,提高工作效率

CSS基础语法

CSS规则由两部分构成:选择器,声明

  • CSS注释:/*注释语句*/

font-size:14px 值和单位之间不能有空格

  • CSS引用:

    在<head></head>标签内:

    <style type="text/css">

    CSS样式...

    </style>

CSS行内样式

在开始标签内添加style样式属性,与html同时加载,不便维护

<p style="color:red;font-size:20px">内容</p>
CSS内部样式

内部样式(嵌入样式),与html同时加载,把CSS样式代码写在:

<style>要放在<head>标签之间

<style type="text/css">
    <!--
    样式...
    -->
</style>

<!---->防止低版本浏览器不识别style标签,加了<!---->在低版本浏览器中样式会被注释掉,在高版本浏览器内注释也不会被识别

CSS外部样式

外部样式表,把CSS样式代码写在独立的一个文件中

页面加载时,同时加载CSS样式

扩展名:CSS文件名.CSS

引入外部文件:<link href="XX.css" rel="stylesheet" type="text/css" />

<link>要放在<head>之间

使用链入外部样式的好处:

1.CSS和HTML分离;

2.多个文件可以使用同一个样式文件;

3.多个文件引用同一个css文件,css只需下载一次;

CSS导入样式

@import "外部CSS样式"

在读取完html文件之后加载

CSS使用方法优先级

行内样式>内部样式>外部样式

  • 说明:

    1.链入外部样式表与内部样式表之间的优先级取决于所处位置的先后

    2.最后定义的优先级最高(就近原则)

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

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

相关文章

成都睿明智科技有限公司共赴抖音电商蓝海

在这个短视频风起云涌的时代&#xff0c;抖音作为现象级的社交媒体平台&#xff0c;不仅改变了人们的娱乐方式&#xff0c;更悄然间重塑了电商行业的格局。在这片充满机遇与挑战的蓝海中&#xff0c;成都睿明智科技有限公司凭借其敏锐的市场洞察力和专业的服务能力&#xff0c;…

MySQL_聚合函数分组查询

上篇复习&#xff1a; 设计数据库时的三大范式1.第一范式&#xff0c;一行数据中每一列不可再分 关系型数据库必须要满足第一范式&#xff0c;设计表的时候&#xff0c;如果每一列都可以用SQL规定的数据类型描述&#xff0c;就天然满足第一范式. 2.第二范式&#xff0c;在第一…

深入了解逻辑回归:机器学习中的经典算法

✅作者简介&#xff1a;2022年博客新星 第八。热爱国学的Java后端开发者&#xff0c;修心和技术同步精进。 &#x1f34e;个人主页&#xff1a;Java Fans的博客 &#x1f34a;个人信条&#xff1a;不迁怒&#xff0c;不贰过。小知识&#xff0c;大智慧。 &#x1f49e;当前专栏…

TESSY学习笔记—project view界面的架构

1&#xff1a;project view界面能添加的元素 project view界面能添加的元素&#xff08;暂且称为元素&#xff09;&#xff0c;打开project view界面&#xff0c;下图中红框勾选出来的就是 2&#xff1a;一共存在5种可添加元素 **1&#xff09;Test collection 测试集合&…

distrobox install in ubuntu 22.04 / 在 ubuntu 22.04 上安装 distrobox (***) OK

要点&#xff1a; 本测试实验&#xff0c;采用的是 podman distrobox 在沙盒 snap 中&#xff0c;安装 distrobox 需要使用 --devmode 开发模式&#xff1b;可以避开 distrobox 的版本检查&#xff1f; distrobox 官方文档显示&#xff0c; Installation https://distrobox.i…

跨域及解决跨域

什么是跨域 前端与后端不在同一个域名下&#xff1a; 解决 import jakarta.servlet.*; import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpServletResponse; import org.springframework.stereotype.Component;import java.io.IOException…

使用Jest进行JavaScript单元测试

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 使用Jest进行JavaScript单元测试 引言 Jest 简介 安装 Jest 创建基本配置 编写测试用例 运行测试 快照测试 模拟函数 代码覆盖率…

【读书笔记/深入理解K8S】集群网络

前言 上一章讲了集群控制器的一个大概的原理&#xff0c;这一章讲一下集群网络。网络是集群通信的载体&#xff0c;因为该书是阿里云团队出品的&#xff0c;所以也以阿里云的集群网络方案为例&#xff0c;其他云厂商的网络集群方案一般来说也大同小异。所以通过本章的学习&…

Varjo核电厂虚拟仿真培训解决方案

虚拟现实技术的融入将帮助核电厂设计验证和操作员培训跟有效的进行。 芬兰的Loviisa工厂是世界上第一个为控制室操作员建造专用VR培训室的核电站。该工厂使用了Varjo混合现实头显设备为员工提供虚拟仿真训练。 案例Fortum: VR为核电厂操纵员培训带来明显优势 与构建物理模拟器相…

推荐一款基于Flash的交互式园林设计工具:Garden Planner

Garden Planner是一款由Artifact Interactive开发的基于Flash的交互式园林设计工具。它允许用户以拖放的方式安排植物、树木、建筑物和各种对象&#xff0c;使园林规划变得简单直观。此外&#xff0c;Garden Planner提供工具来快速创建铺路、路径和围栏&#xff0c;帮助用户设计…

HTML 标签属性——id、class、style 等全局属性详解

文章目录 1. id属性2. class属性3. style属性4. title属性5. lang属性6. dir属性7. accesskey属性8. tabindex属性小结HTML全局属性是一组可以应用于几乎所有HTML元素的特殊属性。这些属性提供了额外的功能和信息,使得网页开发者能够更好地控制元素的行为、样式和可访问性。 …

SpringBoot 整合达梦数据库 Demo

本文将介绍如何在 Spring Boot 项目中整合达梦数据库&#xff0c;并实现基本的用户管理功能。通过以下步骤&#xff0c;我们将创建一个简单的 RESTful API&#xff0c;以便于用户的增删改查&#xff08;CRUD&#xff09;操作。 【点我: 下载整套源码】 1. 创建数据库与数据表 …

高校实验室安全巡检系统设计与实现(源码+定制+开发)高校实验室巡检系统、实验室安全管理平台、实验室安全监控系统、智能实验室巡查系统、高校实验室风险管理

博主介绍&#xff1a; ✌我是阿龙&#xff0c;一名专注于Java技术领域的程序员&#xff0c;全网拥有10W粉丝。作为CSDN特邀作者、博客专家、新星计划导师&#xff0c;我在计算机毕业设计开发方面积累了丰富的经验。同时&#xff0c;我也是掘金、华为云、阿里云、InfoQ等平台…

【系统集成项目管理工程师教程】第4章 信息系统架构

教程内容总结&#xff0c;供参考&#xff0c;有错误请指正&#xff0c;友好交流。 4.架构基础 4.1.1指导思想 4.1.2设计原则 原则内容&#xff1a;包括坚持以人为本、创新引领、问题导向、整体协同、安全可控、科学实施等&#xff0c;这些原则应基于组织的信念和价值观&…

如何学习C++游戏开发

学习C游戏开发是一个涉及多个领域的复杂过程&#xff0c;包括编程、游戏设计、图形学等。 1. **学习C基础**&#xff1a; - 掌握C的基本语法和面向对象编程。 - 学习C标准库&#xff0c;特别是STL&#xff08;标准模板库&#xff09;。 2. **理解游戏开发概念**&#xf…

Socket 和 WebSocket 的应用

Socket&#xff08;套接字&#xff09;是计算机网络中的一个抽象层&#xff0c;它允许应用程序通过网络进行通信。套接字用于跨网络的不同主机上的应用程序之间的数据交换。在互联网中&#xff0c;套接字通常基于 TCP&#xff08;传输控制协议&#xff09;或 UDP&#xff08;用…

mac 本地docker-mysql主从复制部署

mac 本地docker-mysql主从复制部署,服务器同理 1.本地docker启动两个mysql服务.端口号不一样 没有选择挂载到宿主机.只做测试用. 只是端口号不一样容器删掉.就没有数据了. 生产测试,需要挂在 master docker run -d --name mysql-slave -p 3308:3306 \ -e MYSQL_ROOT_PASSWORD…

HTML学习笔记十三

系列笔记目录 第一章 HTML的概述 第二章 URL简介 第三章 网页元素的属性 第四章 html字符编码 第五章 网页的语义结构 第六章 文本标签 第七章 列表标签 第八章 图像标签 第九章 链接标签 第十章 多媒体标签 第十一章 iframe 第十二章 表格标签 第十三章 表单标签 表单标签 系列…

在鱼皮的模拟面试里面学习有感

文章目录 1.上半场1.1.引言1.2.鱼皮的建议 2.下半场2.1中间问题 3.我的总结3.1我的体会3.2我的计划 1.上半场 今天的直播&#xff0c;第一次全程的跟下来&#xff1a;也算是放松一下~~ 1.1.引言 上半场是后来总结的&#xff0c;听的时候没有随手记录&#xff1a; 1&#xf…

思源笔记轻松连接本地Ollama大语言模型,开启AI写作新体验!

文章目录 前言1. 下载运行Ollama框架2. Ollama下载大语言模型3. 思源笔记设置连接Ollama4. 测试笔记智能辅助写作5. 安装Cpolar工具6. 配置Ollama公网地址7. 笔记设置远程连接Ollama8. 固定Ollama公网地址 前言 今天我们要聊聊如何通过cpolar内网穿透技术&#xff0c;把国产笔…