css 02
Css 02
Url ./ http://www.
Src 引入 拿取过来内容
Href 引用 连接前往 a link
现在所有的命名 请按照下面我说的去命名
可以使用字母 数字 下划线组成 但是不能以数字开头
一、CSS常用属性
- 颜色属性
Color
- 背景属性
text-indent:21.0pt">Background-image: 背景图片
Background-repeat: 背景重复
Repeat-x(x轴方向重复) | repeat-y(y轴方向重复) |no-repeat(不重复)
Background-attachment: 背景附件 scroll(默认值) fixed(固定)
Background-position:背景位置
Left|center|right( 横向)
Top|center|bottom(纵向)
像素
注意:background-position 两个值之间需要使用空格隔开
Background:<背景颜色>|<背景图片>|<背景重复>|<背景附件>|<背景位置>
每个属性中间都要用空格隔开
- 边框属性
border-style 边框样式
Border-top-style
Border-left-style
Border-bottom-style
Border-right-style
值:
dotted 点线
Dashed 虚线
Solid 实线
Double 双实线
Groove 槽状线
Ridge 脊线
Inset 内嵌效果
Outset 外凸效果
Border-width 边框宽度
单位使用像素
同上
Border-color 边框颜色
同上
Border:边框宽度 边框样式 边框颜色;
- 文本属性
Letter-spacing 字母间隔 值为长度 值可以是负值 可以支持中文
Word -spacing 词间距 值为长度 值可以是负值 抓取词边界 可以支持中文但是 请加上词边界
Text-decoration 文本修饰
None(默认值) 通常我们使用这个属性将a标签的默认下划线取消
Underline 定义文本下的一条线
Overline 定义文本上的一条线
Line-through 定义穿过文本中的一条线
Text-align 对齐方式
Left|center|right|justify(两端对齐)
Justify 将我们的文字贴近我们的边框 将我们的空白留给中间
Text-indent 文本缩进 2em
line-height 设置行间距离(行高) 不允许出现负值
作用:用来将文本居中显示 一般都是和设置的高度相同 让文字垂直居中显示
5. 鼠标光标属性
Cursor
Text 文本
Crosshair 十字架
Wait 等待
Help 帮助
Pointer 小手
6.列表属性
List-style-type 列表样式类型
值:
Disc 实心点
Circle 圆圈
Square 小方块
Decimal 数字
Lower-roman 小写罗马字
Upper-roman 大写罗马字
Lower-alpha 小写字母
Upper-alpha 大写字母
None 没有标识
List-style-image 列表样式图片
url()
List-style-position 列表样式位置
Inside 表示在li里面
Outside 表示在li外面(默认值)
作用:就是让你来判断是否控制图片被样式表是否修改
三、无意义标签
Div
块级标签,会自动换行(独占一行)
Span
行内标签 内容显示在一行内
块级元素的特点:
1.总是独自占一行显示
2.高度、行高和内边距外边距 都可以控制
3.宽度和浏览器宽度一样 与内容无关
4.可以容纳行内元素和其他块元素
行内元素特点:
1.和其他标签在同一行内显示
2.高度 行高 内边距 外边距 部分可控
3.与内容有关 内容改变宽度改变
4.容纳文本和其他行内元素
css 02的更多相关文章
- CSS.02 -- 样式表 及标签分类(块、行、行内块元素)、CSS三大特性、背景属性
样式表书写位置 内嵌式写法 <head> <style type="text/css"> 样式表写法 </style> </head&g ...
- Jquery 系列(2) 选择元素
Jquery基础学习 jQuery利用css选择符的能力,能够在DOM中快捷而轻松地获取元素. 主要内容如下: 介绍DOM树 如何通过CSS选择符在页中查找元素 扩展jQuery标准的CSS选择符 选 ...
- 推荐25个帮助你提高技能的 CSS3 实战教程
使用 CSS,你能够以极高的效率和易用性创造出美丽的设计.而目前流行的 CSS3 技术更加强大,能够创造更多丰富的效果和功能,而不需要任何外部插件.今天,我为大家收集了25个很有用的 CSS 教程,技 ...
- js_css_dl.dt实现列表展开、折叠效果
第一种方式:不提倡 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- js系列(9)js的运用(一)
本节开始介绍javascript在html页面中的运用. (1)link样式表的动态绑定:(http://files.cnblogs.com/files/MenAngel/text04 ...
- bootstrap02导航菜单
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- bootstrap01登录小例子
引入需要的bootstrap文件 <!DOCTYPE html> <html> <head lang="en"> <meta charse ...
- css04使用外部样式
1.创建一个新的html页面 <!DOCTYPE html> <html> <head lang="en"> <meta charset= ...
- jQuery粘性跟随滚动条滚动的导航栏源代码下载
jQuery粘性跟随滚动条滚动的导航栏源代码下载 作者:网页模板 大小:0.005MB 点击次数:3494 发布时间:2014-03-07 12:55 分享到:0 特效介绍 jQuery粘性跟随滚动条 ...
随机推荐
- SQL 优化总结(一)
查询速度慢的原因 查询速度慢原因很多,常见如下几种: 1.没有索引或者没有用到索引(这是查询慢最常见的问题,是程序设计的缺陷) 2.I/O吞吐量小,形成了瓶颈效应. 3.没有创建计算列导致查询不优化. ...
- 2012年浙大:Hello World for U
题目描述: Given any string of N (>=5) characters, you are asked to form the characters into the shape ...
- Scala学习——可变参数(初)
Scala 通过在参数的类型之后放一个星号来设置可变参数(可重复的参数) object Test { def main(args: Array[String]) { printStrings(&quo ...
- JavaScript高级程序设计学习笔记第三章--基本概念
一.标识符: 1.区分大小写 2.命名规则: 第一个字符必须是一个字母.下划线(_)或一个美元符号($) 其他字符可以是字母.下划线.美元符号或数字 标识符中的字母也可以包含扩展的 ASCII 或 U ...
- TCP 连接的握手信息详解
建立TCP需要三次握手才能建立,而断开连接则需要四次握手.整个过程如下图所示: 先来看看如何建立连接的. 首先Client端发送连接请求报文,Server段接受连接后回复ACK报文,并为这次连接分配资 ...
- 阿里云服务器,无法通过公网ip访问实例
昨天得知阿里云esc又打折了,赶紧入手了一波,因为以前有部署过的经验,所以很快就部署上了项目,就在欣喜的访问时,却无访问. 我按照下面步骤一步一步的检测, 1.服务器上是否成功部署jdk和tomcat ...
- oracle 查询及删除重复记录的SQL语句
查询及删除重复记录的SQL语句 1.查找表中多余的重复记录,重复记录是根据单个字段(Id)来判断 select * from 表 where Id in (select Id from 表 group ...
- linux正则表达式基础
linux中awk,sed,grep等 命令使用区别正则表达式基础 在最简单的情况下,一个正则表达式看上去就是一个普通的查找串.例如,正则表达式"testing"中没有包含任何元字 ...
- API---CreateIoCompletionPort
HANDLE WINAPI CreateIoCompletionPort( __in HANDLE FileHandle, __in HANDLE Existi ...
- 使用的SQLServer版本不支持数据类型“datetime2“
快速解决方法: 原因,在使用ado.net entity的时候,entity使用的数据库是sqlserver 2008, 但后来实际使用中使用的数据库是sqlserver 2005, 操作DateTi ...