java-前端之css
css样式:
<!-- 内联样式:在元素的style属性内写样式 -->
<h2 style="color: red;">愿你单枪匹马,亦能所向披靡!</h2>
<!-- 内部样式:在head内部的style标签里写样式 -->
<style type="text/css" >
/*css的注释是这样的*/
h2{color: blue;}
</style>
<!-- 外部样式:在独立的css文件内写样式href是css文件的路径 -->
<link rel="stylesheet" href="my.css"/>
css样式规则:
1.继承性,父元素(字体,颜色)的某些样式可以被子元素继承
2.层叠性:给一个元素增加不同的声明,效果会叠加
3.优先级:给一个元素增加相同的声明,效果以后者为准,也叫就近原则.
css类选择器:
/*1.元素选择器*/
/*2.类选择器:根据class属性选择一类元素*/
.female{color: pink;}
/*3.id选择器:根据ID属性选择唯一的元素*/
#where{color: lime;font-size: 20px;}
/*4.选择器组:写出一组选择器,可以选中其中每个选择器对应的并集*/
.female,#where{font-weight: bold;}
/*5.派生选择器:*/
/* 1)选择某元素的子孙*/
#p5 b {color: orange;}
/* 2)选择某元素的儿子*/
#p5>b{font-size: 100px;}
p a{font-size: 50px;}
/*6.伪类选择器:选择某状态下的元素*/
/*1)选择未访问过的超链接*/
a:LINK {color:green;}
/*2)选择已经访问过的超链接*/
a:VISITED {color: red;}
/*3)选择激活态的按钮*/
.btn:ACTIVE {background: red;}
/*4)选择有焦点的框*/
.txt:FOCUS{background-color: yellow;}
/*5)选择悬停状态*/
.btn:HOVER {color: gray;width: 50px;}
img:HOVER{width: 250px;height: 250px;}
css之边框--border:
/*1.给标题单边边框*/
h1{border-left: 15px solid blue;border-right: 15px solid red;border-bottom: 15px solid yellow;border-top: 15px solid green;}
/*2.给段落四边同时加边框*/
p{border: 1px dashed red;width: auto;height: 60px;overflow: auto;}
day03
/*1.四边设置相同的边距*/
#d1{padding: 20px;margin: 40px;}
/*2.四边设置不同的边距--顺序是上右下左*/
#d2{padding: 10px 20px 30px 40px;margin: 10px 20px 30px 40px;}
/*3.单边设置边距*/
#d3{padding-top: 20px;margin-left: 30px;}
/*4.对称设置边距 -- 上下 空格后左右*/
#d4{padding: 20px 40px;margin: 50px 70px;}
/*5.对称设置的一个特例:当左右外边距设置为auto时,元素会水平居中*/
#d5{margin: 20px auto;}
我是初学者,如有更新不好的,欢迎这位大神指出,谢谢大家!
更多精彩以后更新,转载注明!
java-前端之css的更多相关文章
- 前端开发css禁止选中文本
在我们日常的Java web前端开发的过程中呢,程序员们会遇到各种各样的要求,所以不每天学的东西感觉自己都退步了,都更不上时代的发展了. 每天应对各种需求,每天活在疑问中就是我们程序员的真是写照.但我 ...
- java前端与后端怎么选??
想做这个行业,就应该了解职能以及技能需求,这样学习才能更高效.我知道一些刚刚入行的小伙伴不清楚前端.后端.到底指的是什么?两者直接的区别 前端开发 前端开发主要涉及网站和App,用户能够从浏览器上或A ...
- 前端开发css实战:使用css制作网页中的多级菜单
前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...
- 前端之css
前端之css 本节内容 css概述及引入 css选择器 css常用属性 1.css概述及引入 CSS概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数 ...
- WEB前端开发CSS基础样式全面总结
Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...
- 前端js,css文件合并三种方式,bat命令
前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...
- 第二篇:web之前端之css
前端之css 前端之css 本节内容 css概述及引入 css选择器 css常用属性 1.css概述及引入 CSS概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式 ...
- 好程序员web前端分享css常用属性缩写
好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #0000 ...
- 前端基础——css
前端基础——css css的内容主要包括:盒子模型.定位.单位与取值.属性.选择器.
- Python web前端 02 CSS
Python web前端 02 CSS 一.选择器 1.CSS的几种样式(CSS用来修饰.美化网页的) #建立模板 复制内容--->SETTING---> Editor -----> ...
随机推荐
- Web 前端实战(三):雷达图
前言 在<Canvas 线性图形(五):多边形>实现了绘制多边形的函数.本篇文章将记录如何绘制雷达图.最终实现的效果是这样的: 绘制雷达图 雷达图里外层 如动图中所示,雷达图从里到外一共有 ...
- 搭建自己的个人web项目指南 ---(一)服务器购买与基础配置 | windows连接到自己的云服务器
(一)服务器购买与基础配置 | windows连接到自己的云服务器 一.服务器选购指南 厂商选择 目前市面上提供服务器租用的厂商很多,比较知名的还是阿里云和腾讯云,两家的稳定性都非常不错,小伙伴们可以 ...
- 关键字——this,super,static,final
this 理解为当前对象. //测试 public static void main(String[] args){ Person person = new Person(3, "xiaoM ...
- NC200190 矩阵消除游戏
NC200190 矩阵消除游戏 题目 题目描述 牛妹在玩一个名为矩阵消除的游戏,矩阵的大小是 \({n}\) 行 \({m}\) 列,第 \({i}\) 行第 \({j}\) 列的单元格的权值为 \( ...
- C语言整形转字符串的方法
今天写力扣第九题,里面用到了这个,就做个笔记. 1. char *itoa( int value, char *string,int radix);(stdlib.h) Windows特有 ...
- 【RocketMQ】消息的拉取
RocketMQ消息的消费以组为单位,有两种消费模式: 广播模式:同一个消息队列可以分配给组内的每个消费者,每条消息可以被组内的消费者进行消费. 集群模式:同一个消费组下,一个消息队列同一时间只能分配 ...
- 解读Go分布式链路追踪实现原理
摘要:本文将详细介绍分布式链路的核心概念.架构原理和相关开源标准协议,并分享我们在实现无侵入 Go 采集 Sdk 方面的一些实践. 本文分享自华为云社区<一文详解|Go 分布式链路追踪实现原理& ...
- HashMap中的哈希函数分析
首先我们要知道,在理想情况下的哈希表中,哈希函数生成的哈希值是value在数组中的下标,其范围是分布于负无穷到正无穷的整个实整数轴的.而在现实情况下,是不可能存在这么大的一个数组的.接下来分析Hash ...
- day03 Java_运算符_分支结构
列表: 运算符的练习:算术.关系.逻辑.赋值.字符串连接.条件 分支结构的练习:if结构 分支结构的练习:if...else结构 参考 运算符的练习:算术 输出几个整数取模,验证结果 声明两个整型变量 ...
- Rails_via牛客网
题目 链接:https://ac.nowcoder.com/acm/contest/28537/D 来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 32768K,其他语言 ...