CSS样式-3

最新推荐文章于 2022-08-09 14:06:48 发布
最新推荐文章于 2022-08-09 14:06:48 发布
阅读量71 收藏
点赞数
分类专栏： HTML 文章标签： css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43285445/article/details/110262178
版权 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			span{
				width:302px;
				height:31px;
				border: 1px solid #e85356;
				display: block;
				text-align: center;
				line-height: 31px;
				background-color: #e4393c;
				color: #fff;
				font-size: 20px;
				font-family: "微软雅黑";
				cursor: pointer;
			}
			
			body{
				/*background-repeat:
				 */
				background-color: red;
				background-image: url(img/body_bg.jpg);
				/*background-repeat: no-repeat;*/
			}
			i{
				/*background-position：设置截取图片的其实位置
				 width height 设置截取图片的大小
				 background-repeat设置图片是否重复*/
				width: 54px;
				height: 51px;
				display: inline-block;
				background-position: -49px -98px;
				background-image: url(img/index.jpg);
				background-repeat: no-repeat;
			}
		</style>
	</head>
	<body>
		<i></i>
  		<span>登录</span>
  		<a href="http://www.baidu.com">百度</a>
  		<style type="text/css">
  			a{
  				text-decoration: none;/*设置下划线*/
  				cursor: pointer;/*设置鼠标在点击该按钮的样式*/
  				color: #333;
  				font-family: "Microsoft YaHei";
  			}
  			/*设置鼠标浮上后的显示*/
  			a:hover{
  				text-decoration: underline;
  				color: #e60012
  			}
  		</style>
	</body>
</html>

 

baijing-hu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
CSS3样式
DGL_CSDN的博客
08-31 247
1 文本 1.1 text-shadow 设置⽂本的阴影 参数：⽔平位移 垂直位移 模糊程度 阴影颜⾊ text-shadow: 20px 27px 22px pink; p { font: bolder 50px "Microsoft Yahei"; text-align: center; margin-top: 10px; color: teal; text-shadow: 10px 10px 5px red; } text-sha...
CSS 三种样式
天空之外
08-21 3009
本节我们要学习一下 CSS 样式的几种形式，在实际应用中向 HTML 中引入 CSS 样式的方法有三种，分别是行内样式、内部样式、外部样式。我们会依次学习这三种方式的优缺点以及应用场景，本节我们先来讲一下行内样式。 什么是行内样式 行内样式，其实从它的名字就可以看出来它的特点，就是直接在 HTML 标签中使用 style 属性设置 CSS 样式。例如像下面这样的： <p style="font-size: 18px;">行内样式</p> HTML 中的 style 属性提供了一种改
CSS中 - -前缀的有关知识
weixin_44240448的博客
08-09 3598
仅供个人学习记录使用
前端CSS3--字体样式
weixin_45981384的博客
08-29 3370
一、font-family设置字体 sans-serif是专指西文中没有衬线的字体 例如：为网页中的文字设置字体为"宋体"。 <style type="text/css"> body{ font-family:"宋体",sans-serif; } 或 body{font-family:"Microsoft Yahei";} </style> 二、font-size设置字体大小 例如：设置网页中文字的字号为12像素。 <style type="text/css"> bod
Css Reset -Css样式重置
jiuyisir的博客
01-12 3493
  在网页实际开发过程中，如果将来网页的浏览者存在使用不同的浏览器(IE, Google, FireFox, Opera, Safari等)对网页进行解析展示的可能，那么我们就不得不从完美的理想预期中转回到本真的现实情况。在设计师们的梦想中都存在着一个十分完美的世界：所有的浏览器都能够理解和适用所有的CSS规则，并且呈现相同的视觉效果(不存在兼容性问题)。但是在实际环境中，在很多情况中事与愿违，很多的css样式在不同内核的浏览器中有着不同的解释和呈现，这就导致了您所期望的预期效果和浏览器解释的实际效果略有差
Css样式--背景样式详解
09-25
背景样式包括背景色、背景图像等等，在图片背景比较多的网页中经常会用到，本文整理了一些，个人感觉还不错，希望对大家有所帮助
CSS3-标签集合.pdf
08-11
【CSS3标签集合】是关于CSS3样式定义和应用的详细介绍。CSS3是层叠样式表的第三版，它扩展了CSS2.1的功能，引入了许多新的标签、选择器和属性，使得网页设计更加丰富和灵活。 首先，CSS3提供了三种样式应用方式：...
css3-ul-ol列表
11-20
在网页设计中，CSS3（层叠样式表第三版）为开发者提供了丰富的样式控制功能，尤其是在处理无序列表（`ul`）和有序列表（`ol`）时，可以创造出各种美观、富有创意的列表样式。`ul`列表通常用于展示项目列表，而`ol`...
css-pro-layout：CSS库，用于构建响应式和可自定义的布局
02-03
CSS Pro布局 CSS库，用于构建响应式和可自定义的页面布局 文献资料 有关完整文档，请访问 入门 您可以使用NPM或Yarn安装CSS专业版 NPM npm install css-pro-layout 纱 yarn add css-pro-layout 将css-pro-layout....
postcss-prefix-selector:使用选择器为所有CSS规则添加前缀
05-12
postcss前缀选择器 使用自定义命名空间.a => .prefix .a每个CSS选择器添加前缀。 目录 安装 $ npm install postcss-prefix-selector 与PostCSS结合使用 const prefixer = require ( 'postcss-prefix-selector' ) ...
HTML页面中显示时间
qq_43285445的博客
12-04 6735
在HTML页面中显示当前时间 1.代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> span{ display: inline-block; /*border: 1px solid black;*/ /*background-color:
添加事件的监听
qq_43285445的博客
12-04 1467
HTML添加事件的方式 1.使用属性onclick，在表头定义函数 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> function test(){ console.log("HelloWorld"); } </script> </head> <b
CSS样式-2
qq_43285445的博客
11-28 197
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div>河南工业大学</div> <style> div{ height: 120px; border: 1px solid red; .
JavaScript对象的创建方式
qq_43285445的博客
12-03 137
JavaScript对象创建 1.直接式 //1.直接创建对象 var student = new Object(); student.name = "zhangsan"; student.dohomework = function(){} 2.初始化 //2.初始化对象 var student = { name:"zhansan", age:18, dohomework:function(){ console.log(this.name+"正在做
CSS样式中padding和margin的区别和使用
qq_43285445的博客
11-28 133
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style > b,span,h1,h2{ border: 1px solid red; } /*margin:用于设置外边距，同级标签间的间距 如果是在垂直方向，会选择两个标签中最大的那个边距，也就是说会进行合并 如果在水平方.
CSS样式-1
qq_43285445的博客
11-28 128
<html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> div{ font: "微软雅黑"; font-size: 100px; } </style> <link rel="stylesheet" href="css/index.css" /> </h.
Form表单
qq_43285445的博客
11-25 121
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!-- action指定表单数据目的地 method设置使用哪个方法处理请求 get：地址栏会显示数据 post ：地址栏不会显示数据 enctype：默认值为：application/x-www.
JavaScript中Event对象
qq_43285445的博客
12-04 87
onsubmit <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> function t(){ return true; } </style> </head> <body> <!-- onsubmit属性必须在f
vue3 css v-bind
最新发布
10-20
在CSS中，v-bind()可以用于动态地绑定CSS属性，使得CSS样式可以根据组件的状态或属性进行动态变化。在Vue3中，v-bind()可以直接在CSS中使用，也可以在SCSS中使用。在CSS中，v-bind()主要完成的任务是将v-bind()中的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值