css选择器

目录

1.什么是css?

2.选择器分类

2.1类选择器

2.3id选择器

2.3通配符选择器

3.字体样式

3.1字体大小

3.2字体粗细

3.3字体系列

3.4font属性连写

3.5样式的层叠问题

4.文本样式

4.1文本缩进

4.2文本水平对齐方式

4.3文本修饰

5.行高

6.垂直居中

7.margin:0 auto

8.谷歌调试工具


1.什么是css?

作用:查找标签,美化内容,美化排版
中文名:层叠样式表

作用:给页面中的html标签设置样式

结构:标签名{css属性:属性值;}

css语法规则:

css引入方式:

行内式会配合Js使用

内嵌式:

外联式

<link rel="stylesheet" href="./my.css">

行内式

<div style="color:green; font-size :30px">

2.选择器分类

2.1类选择器

2.3id选择器

注意:

p标签虽然有内容(css可以有内容),但是加了js之后一定会出错

2.3通配符选择器

所有标签都受到影响

应用场景:设置默认的内外边距

3.字体样式

3.1字体大小

3.2字体粗细

3.3字体系列

3.4font属性连写

复合属性:一个属性冒号后面书写多个值的写法

最后显示为正常字体

3.5样式的层叠问题

最后显示蓝色

4.文本样式

4.1文本缩进

4.2文本水平对齐方式

img父级标签为body

4.3文本修饰

5.行高

常见的表达方式:

6.垂直居中

技巧:设置行高属性值=自身高度属性值

7.margin:0 auto

标签水平居中方法总结:

8.谷歌调试工具

双击body中的html代码,会显示出对应的css代码

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【JAVA】去掉 if...else 的七种绝佳之法...

文章目录 前言方法一&#xff1a;提前 return方法二&#xff1a;枚举方案三&#xff1a;Optional 判空方案四&#xff1a;表驱动法方案五&#xff1a;策略模式 工厂方法方案六&#xff1a;责任链模式方案七&#xff1a;Function总结 前言 我相信小伙伴一定看过多篇怎么去掉 i…

Libhybris之线程局部存储TLS实例(五)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 人生格言&#xff1a; 人生…

Redis应用之二分布式锁

一、前言 前一篇 Redis应用之一自增编号 我们主要介绍了使用INCR命令来生成不重复的编号&#xff0c;今天我们来了解Redis另外一个命令SET NX的用途&#xff0c;对于单体应用我们可以简单使用像synchronized这样的关键字来给代码块加锁&#xff0c;但对于分布式应用要实现锁机…

select在标准输出和套接字上进行监控

selectServerInTCPIPbook.c的内容如下&#xff1a; #include <stdio.h> #include <stdlib.h> #include <string.h> #include <unistd.h> #include <arpa/inet.h> #include <sys/socket.h> #include <sys/time.h> #include <sys/…

kubernetes--Pod进阶

目录 一、资源限制&#xff1a; 1. 资源限制的两种规范&#xff1a; 2. Pod 和 容器 的资源请求和限制&#xff1a; 3. CPU 资源单位&#xff1a; 4. 内存资源单位 &#xff1a; 5. 资源限制示例&#xff1a; 二、健康检查&#xff1a;探针&#xff08;Probe&#xff09; 1. 探…

5. HTML常用标签

5.1 标签语义 学习标签是有技巧的&#xff0c;重点是记住每个标签的语义。简单理解就是指标签的含义。即这个标签是用来干嘛的。 根据标签的语义&#xff0c;在合适的地方给一个最为合理的标签。可以让页面结构给清晰。 5.2 标题标签 <h1>-<h6>(重要) HTML提供了…

【cfeng-work】架构演进和漫谈

架构漫谈和入门 内容管理 intro分层架构MVC模式分层架构大数据时代的复杂架构 前端架构后端架构运维端架构持续演进变化 本文主要是自己接触架构的一些输出漫谈 cfeng 在work中某次负责了后端一个服务的上线&#xff0c;多个模块一起上&#xff0c;结果上线失败&#xff0c;幸运…

Mysql 和 Redis 数据如何保持一致

先阐明一下Mysql和Redis的关系&#xff1a;Mysql是数据库&#xff0c;用来持久化数据&#xff0c;一定程度上保证数据的可靠性&#xff1b;Redis是用来当缓存&#xff0c;用来提升数据访问的性能。 关于如何保证Mysql和Redis中的数据一致&#xff08;即缓存一致性问题&#xf…

Python实现WOA智能鲸鱼优化算法优化卷积神经网络回归模型(CNN回归算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 鲸鱼优化算法 (whale optimization algorithm,WOA)是 2016 年由澳大利亚格里菲斯大学的Mirjalili 等提…

适用于WPF的设计模式

适用于WPF的设计模式 讨论“XAML能不能写逻辑代码”这个问题。我发现这是个有歧义的问题。这个问题可以有两种意思&#xff1a; XAML能不能用来写逻辑代码&#xff1f; XAML文件里能不能包含逻辑代码&#xff1f; 对于第一种意思——XAML是一种声明性语言&#xff0c;就是用来…

Adobe家里那点事儿~~~

今天&#xff0c;我们来谈谈关于Adobe全家桶中Photoshop的故事。 Adobe Photoshop&#xff0c;简称PS。其定位是一款图像处理软件。他主要处理以像素所构成的数字图像。也就是说我们常见的非矢量图片。 Photoshop的专长在于图像处理&#xff0c;而不是图形的创作。他是对已有的…

项目应用多数据源动态切换(动态切换数据库连接)

文章目录 前言准备阶段具体配置功能展示注解方式切换数据源代码方式切换数据源优化方式 动态添加删除数据源事务问题参考文章 前言 最近公司的权限项目要实现多租户的功能&#xff0c;于是就要做数据隔离以确保每个租户的数据的安全性&#xff0c;但是项目中也要动态的提供能够…

动态修改hosts

前言 因工作需要频繁变更hosts&#xff0c; 故须自己实现一个动态管理器&#xff0c; 市面上其实已经有了类似的软件&#xff0c;比如switchhosts!但因为不好集成其他功能&#xff08;如远程连接KVM&#xff09;&#xff0c;所以还是决定自己开发一套。 原理 使用之前强烈建…

JavaScript从入门到精通系列第三十六篇:详解JavaScript中的事件监听和事件响应

文章目录 一&#xff1a;什么叫事件 1&#xff1a;概念 2&#xff1a;处理这个事件 (一)&#xff1a;鼠标单机按钮 (二)&#xff1a;鼠标双机按钮 (三)&#xff1a;鼠标移动 3&#xff1a;写法弊端 4&#xff1a;Dom Event 二&#xff1a;监听事件 1&#xff1a;元素事…

Netty实现通信框架

一、LengthFieldBasedFrameDecoder的参数解释 1、LengthFieldBasedFrameDecoder的构造方法参数 看下最多参数的构造方法 /*** Creates a new instance.** param byteOrder* the {link ByteOrder} of the length field* param maxFrameLength* the maximum len…

4面字节跳动拿到2-2Offer,入职就是30K16薪,全靠这份PDF

前言 当你开始开始去跳槽面试的时候&#xff0c;明明只是一份15K的工作&#xff0c;却问你会不会多线程&#xff0c;懂不懂高并发&#xff0c;火箭造得让你猝及不防&#xff0c;结果就是凉凉&#xff1b;现如今市场&#xff0c;多线程、高并发编程、分布式、负载均衡、集群等可…

ZYNQ实验--Petalinux--Linux C 编程入门

Linux C 编程入门 在 Windows 下我们可以使用各种各样的 IDE 进行编程&#xff0c;比如强大的 Visual Studio。Ubuntu 下也有一些可以进行编程的工具&#xff0c;但是大多都只是编辑器&#xff0c;也就是只能进行代码编辑&#xff0c;如果要编译的话就需要用到 GCC 编译器&…

【数据结构】堆(Heap):堆的实现、堆排序

目录 堆的概念及结构 ​编辑 堆的实现 实现堆的接口&#xff1a; 堆的初始化&#xff1a; 堆的打印&#xff1a; 堆的销毁&#xff1a; 获取最顶的根数据&#xff1a; 交换&#xff1a; 堆的插入&#xff1a;&#xff08;插入最后&#xff09; 向上调整&#xff1a;&#xff0…

网络和Linux网络_1(网络基础)网络概念+协议概念+网络通信原理

目录 1. 网络简介 1.1 独立模式和互联网络模式 1.2 局域网LAN和广域网WAN 2. 协议和协议分层 2.1 协议的作用 2.2 协议分层 2.3 OSI七层模型 3.2 TCP/IP四层(五层)模型 3. 网络通信原理 3.1 协议报头 3.2 局域网和解包分用 3.3 广域网和跨网络 4. 网络中的地址 4…

vscode 快速打印console.log

第一步 输入这些 {// Print Selected Variabl 为自定义快捷键中需要使用的name&#xff0c;可以自行修改"Print Selected Variable": {"body": ["\nconsole.log("," %c $CLIPBOARD: ,"," background-color: #3756d4; padding:…