前端入门第三天

目录

一、CSS定义

二、CSS引入方式

三、基础选择器

1.标签选择器

2.类选择器

3.id选择器

4.通配符选择器

5.画盒子

四、文字控制属性

1.字体大小

2.字体粗细

3.字体倾斜

4.行高

1.行高-垂直居中

5.字体族

6.font复合属性

7.文本缩进

8.文本对齐方式

1.水平对齐方式-图片

9.修饰线

10.颜色

五、调试工具

六、综合案例


一、CSS定义

1.基础选择器

找标签

2.文字控制属性

文字大小、颜色

键值对:

color        颜色

font-size        大小

二、CSS引入方式

特点:

  • 内部:(title下面)style+选择器+属性
  • 外部:(css文件中) 选择器+属性(title下面)link
  • rel 表示联系 stylesheet表示样式表
  • 行内:+属性style

三、基础选择器

1.标签选择器

  • 无法区分同名标签

2.类选择器

  • 区分同名标签
  • 使用多个类选择器 class="red size"

3.id选择器

4.通配符选择器

  • 没有设置该属性的全部内容将选中
  • 清楚标签默认样式(去间隔)

5.画盒子

  • 使用类选择器和这三个属性

四、文字控制属性

1.字体大小

  • 默认字体大小:16px

2.字体粗细

3.字体倾斜

4.行高

上=下

1.行高-垂直居中

  • 只适用于单行文字

5.字体族

6.font复合属性

7.文本缩进

8.文本对齐方式

1.水平对齐方式-图片

9.修饰线

10.颜色

五、调试工具

  • 错误属性有黄色叹号
  • 选择属性进行生效

六、综合案例

  • 新闻详情
  • CSS简介

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Autoxjs从配置环境到打包脚本成apk(细致)

环境配置 手机/模拟器上安装autox.js,官方文档和下载地址在文末 vscode安装Auto.js-Autox.js-VSCodeExt插件 手机与电脑连接 在vscode开启autoxjs服务 快捷键CtrlShiftP打开命令搜索窗口,输入autoxjs,选择开启服务 出现IP和端口号即为开启…

HiveSQL题——collect_set()/collect_list()聚合函数

一、collect_set() /collect_list()介绍 collect_set()函数与collect_list()函数属于高级聚合函数(行转列),将分组中的某列转换成一个数组返回,常与concat_ws()函数连用实现字段拼接效果。 collect_list:收集并形成lis…

2021-10-12 51蛋骗鸡数码管前7位显示1-7第8位显示0-9

缘由 51单片机数码管问题-编程语言-CSDN问答 #include "REG52.h" sbit K1 P3^0; sbit K2 P3^1; sbit K3 P3^2; sbit K4 P3^3; bit k1,wk0; unsigned char code SmZiFu[]{63,6,91,79,102,109,125,7,127,111,128,255,64};//0-9.消隐- unsigned char Js0,miao0,fen…

奠定基础:用于机器学习的微积分、数学和线性代数

一、说明 机器学习是一个引人入胜的领域,它使计算机能够从数据中学习并做出预测或决策,而无需明确编程。然而,在幕后,有一个坚实的数学和线性代数基础,构成了机器学习算法的支柱。在本文中,我们将探讨在深入…

Spring-mvc、Spring-boot中如何在调用同类方法时触发AOP

1. 问题描述 Spring-mvc和Spring-boot中aop可以实现代理的功能,我们可以借此实现事务和日志记录或者限流等多种操作。但是,如果你在一个方法中调用其同类下的其他方法的时候不会触发AOP。本文主要说明其原因及解决办法和实现原理。 2. 原因 AIOP的本质是…

【七】【C++】模版初阶

泛型编程 C中的泛型编程是一种编程范式&#xff0c;它强调代码的重用性和类型独立性。通过泛型编程&#xff0c;你可以编写与特定数据类型无关的代码&#xff0c;使得相同的代码可以用于多种数据类型。 利用重载实现泛型编程 /*利用重载实现泛型编程*/ #include<iostream&…

四、Redis之配置文件

redis配置文件的名称 redis.conf 通过命令 find / -name redis.confvim redis.conf通过 : set nu 设置行号: set nonu 取消行号/关键字 搜索关键字: set noh 取消高亮选择4.1 Units 配置大小单位&#xff0c;开头定义了一些基本的度量单位&#xff0c;只支持 bytes&#…

第六十一天 服务攻防-中间件安全CVE复现K8SDockerJettyWebsphere

第61天 服务攻防-中间件安全&CVE复现&K8S&Docker&Jetty&Websphere 知识点&#xff1a; 中间件及框架列表&#xff1a; lIS,Apache,Nginx,Tomcat,Docker,Weblogic,JBoos,WebSphere,Jenkins, GlassFish,Jira,Struts2,Laravel,Solr,Shiro,Thinkphp,Sprng,Fl…

代码随想录 Leetcode131. 分割回文串

题目&#xff1a; 代码(首刷看解析 2024年2月3日&#xff09;&#xff1a; class Solution { public:vector<vector<string>> res;vector<string> path;bool isPalindrome(const string& s, int start, int end) {for (int i start, j end; i < j;…

获取真实 IP 地址(二):绕过 CDN(附链接)

一、DNS历史解析记录 DNS 历史解析记录指的是一个域名在过去的某个时间点上的DNS解析信息记录。这些记录包含了该域名过去使用的IP地址、MX记录&#xff08;邮件服务器&#xff09;、CNAME记录&#xff08;别名记录&#xff09;等 DNS 信息。DNS 历史记录对于网络管理员、安全研…

单臂路由实验(华为)

思科设备参考&#xff1a; 单臂路由实验&#xff08;思科&#xff09; 一&#xff0c;实验目的 在路由器的一个接口上通过配置子接口的方式&#xff0c;实现相互隔离的不同vlan之间互通。 ​ 二&#xff0c;设备配置 Switch1 <Huawei>sys [Huawei]vlan batch 10 20…

《计算机网络简易速速上手小册》第6章:网络性能优化(2024 最新版)

文章目录 6.1 带宽管理与 QoS - 让你的网络不再拥堵6.1.1 基础知识6.1.2 重点案例&#xff1a;提高远程办公的视频会议质量实现步骤环境准备Python 脚本示例注意事项 6.1.3 拓展案例1&#xff1a;智能家居系统的网络优化实现思路Python 脚本示例 6.1.4 拓展案例2&#xff1a;提…

STM32CAN2进入bus off 模式

工作遇到的问题记录 无人机CAN2整个进不了中断&#xff0c;通过查看寄存器判定出CAN节点进入了bus off mode 为何进入bus off &#xff0c;最后通过示波器看到整个CAN2总线波形就不对&#xff0c;总线出现了错误 Busoff的产生是一定是因为节点自身识别到自己发送错误&#xff…

Latex学习记录

目录 1.Latex各种箭头符号总结 2.[Latex]公式编辑&#xff0c;编号、对齐 3.Latex公式编号: 多行公式多编号&#xff0c;多行公式单编号 4.LaTex中输入空格以及换行 1.Latex各种箭头符号总结 箭头符号 - ➚ (piliapp.com)https://cn.piliapp.com/symbol/arrow/Latex各种箭头…

面试150 二进制求和 位运算

Problem: 67. 二进制求和 文章目录 思路复杂度Code 思路 &#x1f468;‍&#x1f3eb; 参考 复杂度 时间复杂度: O ( n ) O(n) O(n) 空间复杂度: O ( n ) O(n) O(n) Code class Solution {public String addBinary(String a, String b){StringBuilder ans new Stri…

STM32--USART串口(1)串口协议

一、通信接口 全双工&#xff1a;通信双方能够同时进行双向通信&#xff1b; 半双工&#xff1a;通信双方能够进行双向通信&#xff0c;但不能同时通信&#xff1b; 单工&#xff1a;只能从一个设备到另一个设备&#xff1b; 同步&#xff1a;接收方可以在时钟信号的指引下进…

Python爬虫某云免费音乐——多线程批量下载

重点一&#xff1a;每首音乐的下载地址 重点二&#xff1a;如何判断是免费音乐 重点三&#xff1a;如何用线程下载并保存 重点四&#xff1a;如何规避运行错误导致子线程死掉 重点五&#xff1a;如何管理子线程合理运行 需要全部代码的私信 运行效果&#xff1a; 歌手文…

睿尔曼6自由度机械臂ROS驱动包功能拓展之查询指令

1&#xff1a;主要环境预览 1&#xff1a;系统&#xff1a;Ubuntu 20.04 2&#xff1a;ROS&#xff1a;noetic 3&#xff1a;对于系统要求需根据相关手册完成机械臂相关依赖安装&#xff0c;能够运行机械臂本身基本功能&#xff0c; 包括 moveit。 4&#xff1a;准备资料…

指针详解(3)

各位少年&#xff0c;大家好&#xff0c;我是博主那一脸阳光&#xff0c;今天介绍 二级指针 指针数组&#xff0c;还有个指针数组模拟二维数组。 前言&#xff1a;在浩瀚的C语言编程宇宙中&#xff0c;指针犹如一把打开内存世界大门的独特钥匙&#xff0c;它不仅是理解程序运行…

PXIe-5842第三代PXI矢量信号收发器简介

内容 简介​PXIe-5842 VST的主要特性PXI VST软件工具PXI VST应用结论下一步 简介 NI于2012年引入了矢量信号收发器(VST)的概念。VST将RF信号发生器、RF信号分析仪和功能强大的FPGA集成在单个PXI模块上。PXIe-5842 VST是首款提供30 MHz到26.5 GHz连续频率覆盖范围的VST。PXIe…