JAVA12_08学习总结(CSS)

news2024/10/7 20:37:06

今日内容

1. frameset

框架集标签frameset
        框架集标签不能放在body中
            rows
                --划分页面为上下部分
            cols
                --划分页面为左右部分
        框架标签frame
            框架的名称name属性
                <frame src="#" name="#" />
                    src后代表这个框架中打开的页面链接
                    name后代表这个被打开页面的name属性,用来方便操作
                a标签target指定打开链接地址的方式
                需要结合框架标签中使用,必须指定frame打开
                target="frame框架标签的名称"

2. CSS使用

层叠样式表
    书写的内容样式都是系统样式库里有的内容
        1)行内样式
            在单行语句中书写,控制某一个标签,不好
        2)内部方式
            在head标签中书写样式
        3)外部样式
            在项目文件下创建专门存放CSS文件的地方,导入页面中使用
            导入固定格式
                link标签 href属性="css文件地址" rel="stylesheet"

2.1 CSS选择器

常用的CSS选择器
    标签选择器
        --通过标签的名字控制
        标签名{
            样式操作
        }
    类选择器
        --通过给标签定义class属性来控制,可以定义多个相同的类名--通过.调用
        .类名{
            样式操作
        }
    id选择器
        --通过在标签中指定id值来控制,id值必须唯一!
        #id值{
            样式操作
        }
选择器优先级
    id选择器 > 类选择器 > 标签选择器
    
    并集选择器
        --多个选择器,可以一起使用
        选择器1,选择器2,选择器3{
            样式操作
        }
    伪类选择器--锚伪类
        --描述元素(标签)的状态的
            link
                -鼠标没有经过时的状态
            hover
                -鼠标经过时的状态
            active
                -鼠标点击但没有松开时的状态
            visited
                -鼠标点击过的状态
        选择器名称:状态名称{
            样式操作
        }

2.2 CSS文本样式

文本颜色
    color
        color: #FF8C00;
    text-align:对齐方式
        text-align: center;
    text-decoration 属性用于设置或删除文本装饰
        text-decoration: underline;
    letter-spacing 属性用于指定文本中字符之间的间距
        letter-spacing: 5px;
    font-family:字体类型:系统字体库中的字体
        font-family: "楷体";
    font-size:字体大小 指定像素
        font-size: 50px;
    font-style 属性主要用于指定斜体文本
        font-style: italic ;
    font-weight:字体粗细程度  bold:适当加粗(700)
        font-weight: bold; 

2.3 CSS边框样式

border
    边框颜色
        border-color: red ;
    边框的宽度
        border-width: 3px;
    边框样式
         border-style: solid;   
    border简写属性:将上面三个声明到一个中书写
        border:border-width border-style border-color
    边框圆角  像素弧度大小
        border-radius: 5px;

2.4 CSS浮动属性

浮动
    浮动属性float:控制元素向左或者向右浮动,当前这个元素
    表现的就想块框不存在一样,碰到外边框(浏览器)或者其他的块框就停止!

2.5 CSS列表样式属性

列表样式属性
    list-style-type 属性指定列表项标记的类型
        circle 空心圆
        squqre 空心正方形
        disc 实心圆
        none 去掉前面的标记
    list-style-image 属性指定图片类型作为列表项标记
    border-collapse 属性设置是否将表格边框折叠为单一边框
        属性值:collapse  折叠为单一边框

2.6 CSS背景属性

背景属性
    background-color:背景颜色
            background-image:url(图片地址)
                    如果图片本身尺寸和系统分辨率尺寸不同,图片会重复
            background-repeat:设置背景图像是否重复以及如何重复
                    repeat-x:x轴重复
                    repeat-y:y轴重复
                    no-repeat:设置图像不重复
                    repeat:(默认值)x/y轴都重复(图片本身尺寸和系统分辨率尺寸不同,)
                        
            background-positon:设置图像的起始位置
                        top         left   (默认值)
                        center      center
                        bottom      right
    背景的简写属性--一步走         
    background: background-color background-image  background-repeatbackground-position;

3.盒子模型

主要是实践--布局
    margin
        外边框设置--设置外边框到浏览器边缘的位置
    border
        设置边框属性
            -颜色
            -粗细
    padding
        内边框设置--设置内边框到外边框的位置
    内容

 

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

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

相关文章

JavaScript -- 11. BOM及常用对象介绍

文章目录BOM对象1 BOM2 navigator3 location3.1 常用方法3.2 url各部分名称4 historyBOM对象 1 BOM 浏览器对象模型 BOM为我们提供了一组对象&#xff0c;通过这组对象可以完成对浏览器的各种操作 BOM对象&#xff1a; Window —— 代表浏览器窗口&#xff08;全局对象&…

哥斯拉连webshell需要配置(哥斯拉连接Webshell实践)

1. 哥斯拉连webshell需要配置环境 kali linux   docker+vulhub   nginx(1.19.6)+php(7.4.15) 2. 哥斯拉连webshell需要配置过程 2.1 vulhub镜像拉取 vulhub安装的话去官网上有安装教程   Vulhub - Docker-Compose file for vulnerability environment   安装好之后…

VUE基本认知

1&#xff1a;vue介绍 渐进式 JavaScript 框架&#xff08;有2个库&#xff0c;核心库和插件库&#xff0c;如果能用核心库解决的就是用核心库&#xff0c;核心库解决不了的&#xff0c;就使用插件库&#xff09; 渐&#xff1a;逐渐&#xff0c; 进&#xff1a;添加 作者: 尤…

原生数据湖体系

背景&#xff1a; 随着数据量的爆发式增长&#xff0c;数字化转型称为了整个IT行业的热点&#xff0c;数据也开始需要更深度的价值挖掘&#xff0c;因此需要确保数据中保留的原始信息不丢失&#xff0c;从而应对未来不断变化的需求。当前以oracle为代表的数据库中间件已经逐渐…

nginx详细配置负载均衡全过程以及宕机情况处理

一、准备 1.下载安装nginx服务器&#xff08;win10/Linux同样适用&#xff09; 2.两个以上服务的服务地址 二、详细步骤以及宕机情况处理 &#xff08;1&#xff09;编辑 nginx.conf 配置文件&#xff0c;该文件在conf文件夹下面。 轮询&#xff1a; upstream my_server …

【物理应用】超声场可视化仿真模拟【含GUI Matlab源码 1494期】

⛄一、简介&#xff08;附论文&#xff09; 通过对超声场理论的数学物理方法计算&#xff0c;分别对圆型和矩型换能器的声轴线上声压分布、轴方向横截面的声压的分布及声场的指向性的表达式作出推导和演算&#xff0c;并得出结论&#xff1b;以及研究脉冲波声场分布特性&#…

计算机组成大题分析(五)

常见x86汇编指令解释 例题&#xff1a;已知 f(n)n! nX(n-1)XX2X1&#xff0c;计算 f(n)的 C 语言函数 f(n) 的源程序&#xff08;圈住的地方&#xff09;及其在 32 位计算机 M 上的部分机器级代码如下: 其中&#xff0c;机器级代码行包括行号、虚拟地址、机器指令和汇编指令&am…

止损的意义是什么?我们为何要止损这个操作?

止损的意义是什么&#xff1f;我们为何要止损这个操作&#xff1f;我想很多人并没有深入思考这个问题&#xff0c;我猜测绝大数人都会说为了风险控制&#xff0c;无条件执行&#xff0c;割断亏损让利润奔跑&#xff0c;这类的话&#xff0c;其实不然。 我觉得一个操作如果内心…

什么是云计算中的多租户?

在云计算中&#xff0c;多租户意味着一个云供应商的多个客户使用相同的计算资源。即使他们共享资源&#xff0c;云客户也不知道彼此&#xff0c;他们的数据是分开的。多租户是云计算的重要组成部分&#xff0c;没有它&#xff0c;云服务将远不实用。 多租户的经典定义是为多个用…

12月8日(第八天)

DOCKER 参考文章&#xff1a; 十分钟学会用docker部署微服务 Docker 让开发者可以打包他们的应用以及依赖包到一个可移植的容器中&#xff0c;然后发布到任何流行的 Linux 机器上&#xff0c;便可以实现虚拟化。&#xff08;开始时觉得docker麻烦&#xff0c;我部署java应用&a…

Python+Requests实现接口自动化

一般对于自动化的理解&#xff0c;有两种方式的自动化。 第一&#xff0c;不需要写代码&#xff0c;完全由工具实现&#xff0c;这种方式的工具一般是公司自己研发的&#xff0c;方便黑盒测试人员使用。这种工具的特点是学习成本低&#xff0c;方便使用&#xff0c;但是通用性…

JSP SSH共享单车租赁系统myeclipse开发oracle数据库MVC模式java编程计算机网页设计

一、源码特点 JSP SSH共享单车租赁系统是一套完善的web设计系统&#xff08;系统采用ssh框架进行设计开发MVC模式&#xff09;&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要 采用B/S模式开发。开发环境为TO…

亚马逊云科技re:Invent:Serverless成技术新常态

2019年底&#xff0c;亚马逊云科技发布了Amazon Lambda的“预置并发&#xff08;Provisioned Concurrency&#xff09;”功能&#xff0c;它允许亚马逊云科技无服务器计算用户使其函数保持“已初始化并准备好在两位数毫秒内响应”的状态&#xff0c;这意味着“冷启动”问题成为…

xss-labs靶场练习部分记录

目录 靶场环境 测试使用 evel3 evel5 evel6 evel7 evel8 evel9 evel10 evel11 evel12 evel13 evel14 靶场环境 browser&#xff1a;firefox&#xff1b;plugin:Hackbar,tools:burp 注&#xff1a;常见payload在评论区 测试使用 " <> scRiPt oNeEro…

MySQL 的日志(undo log、redo log、binlog)

我们在MYSQL执行过程文章中知道一条SQL语句执行流程是怎么样的&#xff0c;但SQL语句是怎么入库的呢&#xff1f;如下图&#xff1a; SQL语句入库过程在图中涉及三个日志&#xff1a; undo log&#xff08;回滚日志&#xff09;、redo log&#xff08;重做日志&#xff09; 、b…

TI RM57 如何配置RTI作为定时器使用

引言 最近公司要对新项目的算法进行评估&#xff0c;这就需要拿到RM57浮点运算能力数据&#xff0c;测量运算速度就要用到高精度定时器&#xff0c;通过查看芯片手册发现RTI可以满足这个需求&#xff0c;本文对RTI的配置和使用做一个详细的记录&#xff0c;方便以后翻看。 ui…

Python的Socket编程

Python的Socket编程一、Socket简介二、Socket基本参数和函数介绍1. socket参数2.socket相关函数三、Python编写socket的步骤1.python编写server的步骤2.python编写client的步骤四、python socket变成实操1.server.py2.client.py3.socket更多功能五、案例1.TCP案例一&#xff1a…

推特如何解除敏感内容限制

推特如何解除敏感内容的限制&#xff0c;这里为大家分别介绍苹果、安卓、网页版的推特怎么看敏感内容&#xff0c;有需要的朋友可以看一下。 一、苹果安卓手机解除敏感内容方法&#xff08;对应中英文版&#xff09; 1.打开手机推特app&#xff0c;点击左上角的【三横】进入个…

Navicat for MySQL —— 图形化工具使用

Navicat for MySQL 下载链接&#xff1a;点击跳转 提取码&#xff1a;520H 在之前的篇目当中讲到数据库的图形化工具 —— SQLyog的使用&#xff0c;那么本篇目讲的是关于另外一款图形化工具的使用 —— Navicat for MySQL &#xff1b;下面先来安装Navicat for MySQL: Navic…

Linux权限(下)

Linux权限下file指令目录的权限x权限r权限w权限文件的默认权限umask码修改umask码粘滞位背景谁能删除设有粘滞位的目录下的文件&#xff1f;设置粘滞位的注意事项file指令 在此之前我们先了解一个指令&#xff0c;这个指令可以让我们更详细的了解文件的具体类型&#xff0c;虽…