ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

CSS美化页面

2021-12-08 12:30:36  阅读:100  来源: 互联网

标签:style 文本 background text CSS 设置 font 美化 页面


给小编点点关注,点点赞

字体样式:

line-height:设置文本行高

transprent:设置背景颜色透明值

font-family:设置字体类型

font-size:设置字体大小

font-style:设置字体风格

font-weight:设置字体的粗细

font-family的属性:英文,“中文类型”;

字体风格属性有:normal(默认值)、italic、oblique

font-weight属性:normal、bold(粗的)、bolder(更粗)、lighter(更细)

font属性:字体属性的顺序:风格——粗细——大小——类型

可以将四个元素简写到一个标签内:font:italic bold12px “宋体”;(中间用空格隔开,必须要按顺序来写,风格 粗细 大小 类型)

文本样式:

color:设置文本颜色

text-align:设置水平对齐方式(left文本放到左边,right文本放到右边,center文本放到中间,justify实现两端对齐文本效果)

text-indent:设置首行文本的缩进

line-height:设置文本的行高

text-decoration:设置文本的装饰(none默认、underline设置文本的下划线、overline设置文本的上划线、line-through设置文本的删除线)

vertical-align属性:middle居中、top上面、bottom下面(可以设置文本域图片的对齐位置)

text-shadow:文本阴影

text-shadow:color(阴影颜色) x-offset(x轴)y-offset(y轴)blur-radius(阴影半经)

语法:text-shadow: red 2px 2px 2px

超链接样式:

a:link: 未访问样式

a:visited: 访问过后样式

a:hover: 鼠标悬浮上的样式

a:active: 鼠标点击未释放的样式

设置伪类的顺序: a:link>a:visited>a:hover>a:active

列表样式;

list-style:none(没有标记符号)

list-style:disc(默认)

list-style:circle(空心圆)

list-style:square(实心正方形)

list-style:decimal(数字)

网页背景;

background-color:背景颜色

background-image:背景图像

background-position:背景定位

background-repeat:背景重复方式

background-size:背景尺寸

background-repea属性;

repeat:沿水平和垂直方向铺平

no-repeat:不铺平,只显示一次

repeat-x:沿水平铺平

repeat-y:沿垂直铺平

background-size属性;

auto:默认值

percentage:比例

cover:放大

contain:缩小

颜色渐变:

linear-gradient(position,color1,color2)

【position】渐变的方向

【colo1】第一种颜色

【color2】第二种颜色

总结:

 

标签:style,文本,background,text,CSS,设置,font,美化,页面
来源: https://blog.csdn.net/li20010310/article/details/121788210

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有