第五章 CSS美化网页元素
2024-08-27 06:57:43
一.span标签:能让某几个文字或者某个词语凸显出来
<p>
今天是11月份的<span>第一天</span>,地铁卡不打折了
</p> 二.字体风格 font-family:字体类型
font-size:字体大小
font-style:字体风格
font-weight:字体粗细
font: 风格 粗细 大小 类型;
三.文本样式 color 设置文本颜色 rgb(0,0,255),rgba(0,0,255,0.5)
text-align 设置元素水平对齐方式
text-indent 设置首行文本的缩进
line-height 设置文本的行高
text-decoration 设置文本的装饰
vertical-align 设置文本垂直方式
text-shadow 设置文字阴影 text-shadow: 颜色 x轴偏移位置 y轴偏移位置 模糊半径
四.超链接伪类
单击访问前
.class01:link{
color: green;
text-decoration: none;
}
单击访问后
.class02:visited{
color: pink;
text-decoration: none;
}
鼠标悬浮
.class03:hover{
color: aqua;
text-decoration: none;
}
单击未释放
.class04:active{
color: red;
text-decoration: none;
}
五.列表样式
list-style-type 列表项前图标
list-style-image 列表项前图片
list-style-image:url(../image/QQ图片20181101095555.png); 六.背景样式
background-color 设置背景颜色
background-image 设置背景图像
background-repeat 设置图像是否平铺
background-position 设置背景图像位置
background: 背景颜色 背景图像 x轴偏移位置 y轴偏移位置 平铺;
七.渐变
IE浏览器是Trident内核,加前缀:-ms-
Chrome浏览器是Webkit内核,加前缀:-webkit-
Safari浏览器是Webkit内核,加前缀:-webkit-
Opera浏览器是Blink内核,加前缀:-o-
Firefox浏览器是Mozilla内核,加前缀:-moz- background: -webkit-gradient(linear,left bottom,right top,from(red),to(blue));
background: linear-gradient(to bottom left,red,black);
最新文章
- 学习Spring——依赖注入
- windows Apache+cgi的配置方法
- atitit.404错误的排查流程总结vOa6
- Atitit .html5刮刮卡的gui实现总结
- Mongo简单查询总结
- [AngualrJS] ng-strict-di
- css笔记——小图标文字对齐中级解决方案
- 《微信小程序七日谈》- 第五天:你可能要在登录功能上花费大力气
- python爬虫如何爬知乎的话题?
- HTTP与私有二进制协议之间的区别
- CWMP开源代码研究番外篇——博通方案
- 【原创】sqlite ef6 踩坑
- java策略设计模式
- oracle 的sqlplus 工具进行翻译的rlwrap 安装教程
- SoapUI Pro Project Solution Collection-XML assert
- Java知多少(86)文本框和文本区的输入输出
- L1-006 连续因子(20)(思路+测试点分析)
- 数据库帮助类 SqlServerHelp
- @Retention(保留) 此注解用于运行时候(反射)时候使用 如果不使用的话 在反射时候无法获取到注解的值
- SQL 数据库无法附加,提示 MDF"; 已压缩