博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
20150921css2
阅读量:5734 次
发布时间:2019-06-18

本文共 1291 字,大约阅读时间需要 4 分钟。

 

一、border边框

border:1px solid #F00;

border-style:dashed虚线 dotted点点点 边框样式

border-width:3px;边框宽度

border-color:#F00;边框颜色

还可以控制四个边的属性

border-top、border-bottom、border-left、border-right

二、背景

background-color:#F00; 背景颜色

background-image:url(../image/2.jpg);/*背景图片*/

background-repeat:no-repeat;/*背景不平铺*/

background-repeat:repeat-x;/*横向平铺*/

background-repeat:repeat-y;/*纵向平铺*/

background-position:10px 20px;/*图像的方位距DIV左10px 上面20px */

background-size:cover;/*CSS3拉伸铺满*/

background-attachment:fixed;/*背景图片固定*/文本大于图片时,可以让图片固定

可以写成一句话:

background:blue url(xx.jpg) no-repeat fixed 5px 10px;

把常用的图标放到透明的png,可以减少宽带

background-position:0px  -100px;/*定位图片的位置*/

三、表格样式

<caption>表格标题<caption>

caption-side:bottom;/*标题在下面*/

table{ width:160px; heigt:200px; border-collapse:collapse;}/*细线合并*/

td,th{ border:1px solid red; text-align:center}/*td,th共用一个样式*/

<th scope="col">列表头

<th scope="row">行表头

四、去掉超链接的下划线

<a href="#">a<a>

Text-decoration:none; underline下划线 line-through删除线 overline至顶线

五:伪类

a:link  a:visited a:hover a:active

#d1:hover{ cursor:pointer; }鼠标放上显示手的形状

 六:overflow

当内容超出DIV的宽度

overflow:hidden;超过隐藏

overflow:auto;超过显示滚动条

overflow:scroll;不超过、超过都有滚动条

七、选择器

#d1 a{d1下的a标签}

#d1 #d2 a {d1下的d2下的a标签}

#d1,#d2{d1,d2共用一个样式}

 

css最核心的就是:浮动、盒子模型、定位

ID用处:上证指数

把基础练熟

转载于:https://www.cnblogs.com/16lily521/p/4872115.html

你可能感兴趣的文章
WEB前端 CSS选择器
查看>>
计算A/B Test需要的样本量
查看>>
二叉树前序中序后序遍历的非递归方法
查看>>
mysql 行转列列转行
查看>>
《设计模式系列》---桥接模式
查看>>
[Unity3d]Shader 着色器 学习前了解知识
查看>>
Linux中文件颜色所代表的属性和颜色
查看>>
Redrain duilib中事件委托存在的问题
查看>>
43、我的C#学习笔记9
查看>>
网站建表实践及优化
查看>>
字符串的简单操作
查看>>
C#新功能--命名参数与可选参数
查看>>
strtok和strtok_r
查看>>
维辰超市:借助云商城成功转型新零售
查看>>
web.xml中<load-on-start>n</load-on-satrt>作用
查看>>
python之路---进程
查看>>
1061. Dating (20)
查看>>
leetcode 【 Best Time to Buy and Sell Stock II 】python 实现
查看>>
【算法】CRF
查看>>
windows 8 微软拼音输入法
查看>>