- 博客(21)
- 收藏
- 关注
原创 CSS画三角形
1. 设置一个盒子2. 设置四周不同颜色的边框3. 将盒子宽高设置为0,仅保留边框4. 得到四个三角形,选择其中一个后,其他三角形(边框)设置颜色为透明 <style> div { /* width: 100px; height: 100px; */ width: 0; height: 0; border-top: 10px solid tra
2022-04-20 19:58:23
103
原创 CSS装饰
1. 垂直对齐方式解决行内/行内块元素垂直对齐问题属性名:vertical-alignvertical-align:baseline 默认 基线对齐top:顶部对齐middle:中部对齐bottom:底部对齐(拓展)项目中 vertical-align 可以解决的问题1. 文本框和表单按钮无法对齐问题2. input和img无法对齐问题3. div中的文本框,文本框无法贴顶问题4. div不设高度由img标签撑开,此时img标签下面会存在额外间隙问题5..
2022-04-20 19:54:59
328
原创 CSS定位
目录一.定位的基本介绍1.网页常见布局方式 定位2.定位的常见应用场景二.静态定位三.相对定位:relative 简写:por四.绝对定位:absolute 简写:poa五.子绝父相 六.绝对定位 居中七.固定定位:fixed 缩写:pof八.元素的层级问题一.定位的基本介绍1.网页常见布局方式 定位 可以让元素自由的摆放在网页的任意位置 一般用于盒子之间的层叠情况 2.定位的常见应用场景 可以解决盒...
2022-04-11 23:49:18
448
原创 CSS浮动
1.浮动的作用块标签在一行完美的体现 让垂直布局的盒子变成水平布局,如:一个在左,一个在右 属性名:float 属性值: 属性名 效果 left 左浮动 right 右浮动 浮动元素会脱离标准流(简称:脱标),在标准流中不占位置 • 相当于从地面飘到了空中 浮动元素比标准流高半个级别,可以覆盖标准流中的元素 浮动找浮动,下一个浮动元素会在上一个浮动元素后面左右浮动 浮动元素有特殊的显示效果 • 一行
2022-04-11 23:31:46
332
原创 CSS伪元素
能够使用伪元素在网页中创建内容 伪元素:一般页面中的非主题内容可以使用伪元素 区别: 元素:HTML设置的标签 伪元素:由CSS模拟出的标签效果 种类 伪元素 作用 ::before 在父元素内容的最前添加一个伪元素 ::after 在父元素内容的最后添加一个伪元素 注意点: 必须设置content属性才能生效 伪元素默认是行内元素 装饰性的 美化的 一般都可
2022-04-11 23:20:34
223
原创 CSS结构伪类选择器
能够使用结构伪类选择器在HTML中定位元素选择器 说明 E:first-child{} 匹配父元素中第一个子元素,并且是E元素 E:last-child{} 匹配父元素中最后一个子元素,并且是E元素 E:nth-child(n){} 匹配父元素中的第n个子元素,并且是E元素 E:nth-last-child(n){} 匹配父元素中倒数第n个子元素,并且是E元素 n的注意点: n为:0、1、2、3、4、5、6、.......
2022-04-11 23:19:22
149
原创 CSS盒子模型
一.盒子模型的介绍1.盒子的的概念 页面中的每一个标签,都可看作是一个"盒子",通过盒子的视角更方便的进行布局 浏览器在渲染(显示)网页时,会将网页中的元素看做是一个个矩形区域,我们也形象的称之为盒子 2.盒子模型 CSS中规定每个盒子分别由:内容区域(content)、内边距区域(padding)、边框区域(border)、外边距区域(margin)构成,这就是盒子模型 二.边框(border) 属性值:单个取值的连写,取值之间以空格隔开 如:..
2022-04-11 23:05:24
388
原创 CSS元素的显示模式
1.块级模式 显示特点: 独占一行(一行只能显示一个) 宽度默认是父元素的宽度,高度默认由内容撑开 可以设置宽高 代表标签: div、p、h系列、ul、li、dl、dt、dd、form、header、Nav、footer........ <style> /* 块级元素:独占一行 宽度默认是父级的100%,添加宽高都生效 */ div { width: 3
2022-04-01 22:43:16
420
原创 css选择器进阶
1.复合选择器: 空格 作用:根据HTML标签的嵌套关系,选择父元素后代中满足条件的元素 选择器语法:选择器1 选择器2{css} 结果: 在选择器1所找到标签的后代(儿子、孙子、重孙子...)中,找到满足选择器2的标签,设置样式 注意点: 后代包括:儿子、孙子、重孙子...... 后代选择器中,选择器与选择器之前通过空格隔开 <style> /* 找到div的儿子p设置文字颜色是红色 */
2022-04-01 22:33:21
360
原创 css背景相关属性
1.背景颜色 属性名:backgronud-color(bgc) 属性值: 颜色取值:关键字、rgb表示法、rgba表示法、十六进制....... 注意点: 背景颜色默认值是透明:rgba(0,0,0,0)、transparent 背景颜色不会影响盒子大小、并且还能看清盒子的大小和位置,一般在布局中会习惯先给盒子设置背景颜色 <style> div { /* backgr
2022-04-01 22:26:39
492
原创 css字体和文本样式
一.字体1.字体大小 属性名:font-size 取值:数字+px 注意点: 谷歌浏览器默认文字大小是16px; 单位需要设置,否则无效 <style> p { font-size: 30px; } </style></head><body> <!-- 默认字号是16px --> <p>
2022-04-01 22:16:08
458
原创 css基础认知和基础选择器
一.CSS引入方式1.内嵌式:CSS写在style标签中 提示:style标签虽然可以写在页面任意位置,但是通常约定写在head标签中 <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scal
2022-04-01 22:05:38
63
原创 面向对象之继承
继承的本质是对某一批类的抽象,从而实现对现实世界更好的建模 extends的意思是"拓展"。 子类是父类的拓展 Java中类只有单继承,没有多继承!一个儿子只可以有一个爸爸 一个爸爸可以有多个儿子 继承是类和类之间的一种关系.除此之外,类和类之间的关系还有依赖、组合、聚合等。 继承关系的俩个类,一个为子类(派生类),一个为父类(基类).子类继承父类,使用关键字extends来表示. 子类和父类之间,从意义上讲应该具有"is a"的关系 ...
2022-03-23 17:30:15
75
原创 封装对象详解
封装 该露的露,该藏的藏 程序设计要追求"高内聚,低耦合". 高内聚:就是类的内部数据操作细节自己完成,不允许外部干涉; 低耦合:就是仅暴露少量的方法给外部使用; 封装(数据的隐藏) 通常,应静止直接访问一个对象中数据的实际表示,而应通过操作接口来访问,这称为信息隐藏。 记住这句话:属性私有, get/set❤ //类 private:私有public class Student { //属性私有
2022-03-22 22:21:10
694
原创 回顾和加深方法的使用
回顾方法及加深 方法的定义 1.修饰符 // public 2.返回类型 // int数值类型、void、 String字符串类型 3.break:跳出switch,结束循环 return:结束方法,返回一个结果 结果可能为空 也可能为任意一个类型 4.方法名: 注意规范就ok,借名知意 5.参数列表: 参数类型,参数名 6.异常抛出:疑问,后面再来写 方法的调用:递归 非静态方法 //学生类public class Student {
2022-03-22 21:14:42
231
原创 类与对象的使用
1.类与对象 类是一个模板:抽象的 对象是一个具体的实例 2.方法 定义、调用! 3.对应的引用 引用类型: 基本类型(8大基本类型) byte short int float boolean double long char 对象是通过引用来操作的: 栈--->堆() 4.属性: 字段Field 成员变量 默认初始化: 数字: 0 0.0 char: u0000 boolean: fa..
2022-03-22 21:09:03
350
原创 制造简易计算器
package com.zhang.Method;import java.util.Scanner;public class counter { public static void main(String[] args) { Scanner scanner = new Scanner(System.in); int num1 = 0; int num2 = 0; int d = 0; System.ou.
2022-03-19 13:55:51
361
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人