CSS样式学习笔记

原创 2013年12月04日 09:43:50

如何利用CSS做到图文混排?
把文字当作图片处理,图片当作文字处理
为了保证图片不占一行(或一个div),需要用float:left这个样式,写海报“首字母下沉”效果需要用到这个样式

利用<li>标签做导航标签?
设置list-style-type:none;float:left;
可以不需要<ul>标签,如果有则也需要将list-style-type:none;

 

在CSS样式中设置body样式——全局风格?

body{
	font-size:12px;
	color:#000000;
	text-align:center;
	font-family:Arial,Helvetica;
	width:1024px;
	--上面是定义全局网页的风格
	magin:opx;
	padding:0px;
	--最下面两句是“内容居中”的风格,让顶部无空白部分
}

 

边框
border:border-width || border-style || border-color
border:groove;
border:groove blue;
border:4px groove blue;
备注:为了能让边框显示出来,必须指定边框的类型,宽度和颜色都有相对应的默认值(需要指定出来,不然显示不出来)

 

 

定位与布局两种样式结合
定位:position: absolute(可重叠,相对于最近的父组件)relative(不可重叠)static
 z-index:重叠之后出现分层,显示层次的顺序
 top
 right
 bottom
 left
布局:float:none(对象不漂浮)left(向左浮动)right(向右浮动)
 overflow:
 overflow-x:
 overflow-y:
 display:不保留占据的物理空间
 visibility:保留占据的物理空间

<span>标签被用来组合文档中的行为元素
注:如果不对该标签使用样式,它和文本内容是没有区别的

 

滤镜功能
CSS2滤镜只针对IE起作用,因为这个是IE特有的,由于滤镜效果被广大开发者喜欢,慢慢的也被很多人接收,所以CSS3也添加了滤镜这个功能,CSS3可以解决CSS2滤镜不兼容的问题,CSS3标准是支持滤镜功能的

<table>
	<caption>表格标题</caption>
	<tr>
		<th></th>
		<th>2004</th>
		<th>2005</th>
	</tr>
	<tr>
		<th>拨款</th>
		<td>11111</td>
		<td>22222</td>
	</tr>
	<tr>
		<th>投资</th>
		<td>33333</td>
		<td>44444</td>
	</tr>
<th>标签起强调作用
<td>标签是普通的一列 

 

 

设置链接有下划线的CSS样式?

text-decoration:underline;     //有下划线
text-decoration:none;          //无下划线

 

使用jquery修改样式?
$("#id").css("color","#ffffff");
按钮灰化的颜色是——#ACA899      (可以使用屏幕取色软件)

css样式学习笔记

字体 fontfont-style:设置字体风格 font-variant:大写字母风格 font-weight:字体宽度 font-size:设置字体大小 line-height:设置对象...
  • baoluqi
  • baoluqi
  • 2015年08月25日 09:54
  • 118

css样式学习笔记三

qweqwe
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:37
  • 2497

css样式学习笔记五

1、form以及input标签都是可以设置他的宽度和高度的 也就有样式一称 2、类里面可以有多个值 class="name1 name2 ...." 突出特性 3、路径 ../ 返回上一级目录 4、i...
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:38
  • 140

css样式学习笔记六

网上搜索css中的各种命名规范 一、命名 类以及id、文件命名 1.根据开发文档去命名 2.业内常用命名规范命名 二、类的命名 1)根据布局结构去命名header left right center ...
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:39
  • 2436

css样式学习笔记七

一、属性选择器 (css3.0以后的版本会支持的) (1)选择器[属性=值]{color:red;} 比如: p[align=right]{color:red;} input[type=button]...
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:40
  • 2472

css样式学习笔记二

1、选择器分组 选择器1,选择器2,选择器3,{      } 注意上面的是选择器,可以是元素选择器、类选择器、id选择器等多种选择器的结合 2、后代选择器 先辈选择器 后代选择器{      } ....
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:36
  • 2480

css样式学习笔记四

1、css定位 元素的显示方式: 一、块级元素(上下布局) 1)默认宽度为100%,独占一行 2)可以设置宽度、高度的尺寸 3)块级元素可以包含(嵌套)行内元素 常见的快元素:div、p、ul、li、...
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:38
  • 2458

css样式学习笔记一

1、Web标准:结构(Html)+表现(样式)+行为(js) 2、样式的选择器: (1)标签(元素选择器)p{ } (2)类选择器 .time1{} (3)Id选择器 #time2{} (4)通配符选...
  • ydm19891101
  • ydm19891101
  • 2016年02月16日 13:36
  • 2508

三种方法实现实时切换CSS样式

两套CSS,分别封闭在两个不同的文件中:blue.css和green.css。1.浏览器的页面风格设置在和之间加入如下两行XHTML代码:          主题A" href="a.css" /> ...
  • JOHNCOOLS
  • JOHNCOOLS
  • 2006年10月12日 00:59
  • 828

CSS样式投影效果

1.CSS样式投影效果: 最佳答案 只需要利用CSS中的position属性就可以了,实现方法非常简单 以下为网页源代码,保存为.html文件即可以使用: ---------------------...
  • Solo_two
  • Solo_two
  • 2016年05月18日 11:32
  • 651
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:CSS样式学习笔记
举报原因:
原因补充:

(最多只允许输入30个字)