CSS 样式二
CSS文本样式
- text-align:设置文本的对齐方式
取值:
left 向左对齐
right:向右对齐
center:居中对齐
- text-indent:设置文本的首行缩进
例如,字体设为12px,首行缩进另个字,24px。
- text-decoration:设置文本的装饰线
取值:
none 不设置文本装饰线
underline:设置下划线
overline:上划线
line-through:中划线
- text-transform:(主要应用于英文文本)
取值:
capitalize:将首字母转换大写
uppercase:将所有的字母转换大写
lowercase:将所有的字母转化小写
- letter-spacing:如果是汉字,设置字与字之间的间距
如果是英文文本,设置,字母与字母的间距
- word-spacing:设置词间距(主要应用英文)
- line-height:设置文本的行高
结构代码:
示例2:
样式代码:
结构代码:
CSS列表样式
list-style:设置列表的符号类型
取值:
不设置符号
none
无序列表的项目符号:
square:实心方块
circle:空心原点
disc 实心原点
有序列表的项目符号
decimal 阿拉伯数字
lower-alpha 小写字母
upper-alpha 大写字母
lower-roman 小写罗马数字
upper-roman 大写罗马数字
list-style-position:项目符号的位置
inside(在li标签的内部)
outside(在li标签的外部)
list-style-image:将项目符号用背景图片表示
书写规则:list-style-image:url(背景图片的路径URL)
简写形式:list-style:square inside url(arrow.gif);
示例1:
样式代码:
结构代码:
CSS背景样式
background-color:设置背景颜色:red #ff0000,rgb(100,120,200)
background-image:url(背景图片的路径url)
background-repeat:
no-repeat:不平铺
repeat:x轴和y轴平铺
repeat-x:在x轴上平铺
repeat-y:在y轴上平铺
background-position:设置图片的位置;
数值表示法,x px,ypx 只写其中一种,表示另外一个方向上未设置的值,跟这已经设置的这个相同。
单词表示法:
x方向:left center right,
y轴方向:top(顶部对齐) center(居中) bottom(底部)
百分比表示法:50%,50%
background-position:left center;
设置图片x轴向左对齐
设置图片y轴向居中对齐
代码:
CSS 样式二的更多相关文章
- 如何在普清的屏上调试CSS样式二倍图背景
背景: 最近就遇到一个同事的项目,还是像平常一样小心切图,认真对像素. 一切测试都没有问题,顺利上线. 但是,上线之后,产品经理跑过来说,有BUG. BUG描述:(不认为是BUG) 前端页面上的图标是 ...
- 博客CSS样式 二
预览 可自行更改颜色 背景图 页面定制 CSS 代码中加入: url为背景图地址,可下载心仪背景图后上传到博客园相册后获取地址 body { color: #000; background: url( ...
- css扁平化博客学习总结(二)css样式重置
css样式重置 方法一:不推荐使用,这么写会让网页解析速度变慢. *{ margin: 0; padding: 0;} 方法二:大家常用的写法,比较流行. body, html, div, block ...
- css入门二-常用样式
css入门二-常用样式总结 基本标签样式 背景色background-color 高度height; 宽度width; 边框对齐以及详细设定举例 width/*宽度*/: 80%; height/*高 ...
- 一、CSS概述 二、CSS的选择器(认识) 三、CSS样式和属性(练习) 四、重构商城首页DIV+CSS(页面布局)(重点) 浮动/更改显示方式
一.CSS概述###<1>概念 DIV,就是一个HTML元素,块级元素,通常结合CSS进行页面的布局. CSS,层叠样式表,给HTML元素增强显示. ###<2>作用 样式定义 ...
- 前端(二):css样式
本节笔记根据css中文手册整理,内容已做成思维导图.下载地址https://files.cnblogs.com/files/kuaizifeng/css.xmind.zip. css(Csacadin ...
- CSS样式之操作属性二
********css样式之属性操作******** 一.文本属性 1.text-align:cnter 文本居中 2.line heigth 垂直居中 :行高,和高度对应 3.vertical-al ...
- CSS样式表及选择器相关内容(二)-伪类与伪元素选择器
伪类与伪元素选择器归纳: 一.伪类选择器(伪类以":"开头,用在选择器后,用于指明元素在某种特殊的状态下才能被选中) 1.a标签伪类选择器,其他标签类似 eg: ...
- CSS样式----图文详解(二):css属性
主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...
随机推荐
- 使用TopShelf轻松开发Window服务
关于TopShelf 描述: Topshelf is a framework for hosting services written using the .NET framework. The cr ...
- SPOJ LIS2 Another Longest Increasing Subsequence Problem 三维偏序最长链 CDQ分治
Another Longest Increasing Subsequence Problem Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://a ...
- zoj 3511 Cake Robbery(线段树)
problemCode=3511" target="_blank" style="">题目链接:zoj 3511 Cake Robbery 题目 ...
- 苹果ipa软件包破解笔记
苹果的验证机制: Appstore上的应用都採用了DRM(digital rights management)数字版权加密保护技术,直接的表现是A帐号购买的app,除A外的帐号无法使用,事实上就是有了 ...
- fedora 20 注销
当系统只有一个用户和只有一个桌面环境时,Fedora 20将不会显示Log Out菜单. 如果你确实需要logout,可以通过执行gnome-session-quit命令来logout. 如果你确实需 ...
- JAMA:Java矩阵包
原文链接:JAMA:Java矩阵包 API文档链接:线性代数Java包 JAMA jama是一个非常好用的java的线性代数软件包.适用于日常编程可能碰到的各种矩阵运算问题,提供了一个优雅的简便的解决 ...
- 步进循环语句for
一.for语句的基本格式 for 变量 in 列表 do 语句块 done 二.使用for语句处理列表(数组) [root@localhost shell]# cat use_for_deal_wit ...
- 用scikit-learn实现朴素贝叶斯分类器 转
原文:http://segmentfault.com/a/1190000002472791 朴素贝叶斯(Naive Bayes Classifier)是一种「天真」的算法(假定所有特征发生概率是独立的 ...
- jenkis编译报错:需要class,interface或enum
现象: 1.jenkis编译报错:需要class,interface或enum 2.使用ant进行编译ok. 解决方法: 1. Jenkis重新编译一个以前成功的svn版本,直至编译成功. 2.Jen ...
- Sky number
描述 key 天生对数字特别敏感,一次偶然的机会,他发现了一个有趣的四位数2992,这个数,它的十进制数表示,其四位数字之和为2+9+9+2=22,它的十六进 制数BB0,其四位数字之和也为22,同时 ...