前端CSS基础7.8
1、css选择器:相当于一个标识,有3种选择器
第一种选择器:标签选择器 p{ color:red;}
第二种选择器:class选择器 .c1{ color:green;} 可被多次调用
第三种选择器:id选择器 #d1{ color:blue;} 独有
优先级:标签<class<id
注意:一个标签可以有多个class,但是只能有一个id
2、css文字效果:
字体:font-family
字号:font-size
颜色:color
粗体:font-weight
下划线:text-decoration:underline(删除线:line-through;顶划线:overline)
英文首字母大写:text-transform:capitalize(全部大写:uppercase;全部小写:lowercase)
字母间距:letter-spacing
水平位置:text-align
居中:
水平居中:text-align:center
垂直居中:line-height:300px;(和文字所在的div的高度一样)
3、css继承性:
#d1 p 表示id为d1的标签下面的p标签
#d1,p 表示id等于d1的标签和p标签
注意:css具有继承性,只有字体相关的css属才能够被继承 (面试常问)
4、边框:
样式 粗细 颜色
border: solid 1px red;
等同于下面3句话:
边框样式:border-style:solid;(实线:solid;虚线:dashed;点划线:dotted)
边框粗细:border-width:1px;
边框颜色:border-color:red;
5、背景:
背景颜色:background-color:#00FF00;
背景图片:background-image:url(路径);
(注意:当图片的的大小,小于它所在的div时,图片会横向、纵向填满div)
背景重复:background-repeat:no-repeat;(不重复:no-repeat;横向重复:repeat-x;纵向重复:repeat-y)
背景方位:background-position:5px 10px;(左边、上边)
背景固定:Background-attachment:fixed;
综合:
background:blue url(xx.jpg) no-repeat fixed 5px 10px;
6、补充内容:
·table表格的css属性:border-collapse:collapse;(表格间隙合并)
常用属性:width、height、border、cellspacing、cellpadding、bordercolor、bgcolor、align
宽 高 边框 内框宽 文字到边框距 边框颜色 背景色 水平位置
·链接时是手的形状:cursor:pointer;
转载于:https://www.cnblogs.com/marchtree/p/4631536.html
前端CSS基础7.8相关推荐
- 前端css基础知识点之PC端项目-规范
前端css基础知识点之PC端项目-规范 1 文件管理 文件名用英文命名 css文件夹 reset.css(常用的浏览器样式) public.css(公共的样式.比如页面的头部尾部.重复使用字体.字号等 ...
- 前端css基础知识点之opacity——透明度
前端css基础知识点之opacity--透明度 opacity opacity:num /*num 0到1*/ 兼容性 ie9及以上和标准浏览器都支持 特点 设置opacity的元素的所有后代会一起具 ...
- 前端——CSS基础学习【part 2】
前端--CSS基础学习[part 2] Emmet CSS的复合选择器 CSS的元素显示模式 CSS的背景 CSS的三大特性 CSS 盒子模型 Emmet 快速生成HTML结构语法 (1)生成标签,输 ...
- 前端CSS基础之案例--图片
用<前端CSS基础>文章里的内容完成一个图片案例 效果展示: 代码实现: <!DOCTYPE html> <html lang="en"> &l ...
- 前端css基础知识点之sprite——雪碧(精灵)
前端css基础知识点之sprite--雪碧(精灵) css sprite css精灵或css雪碧 把网页中一些背景图片整合到一个大文件中,然后利用 background-image.backgroun ...
- 从头学前端-CSS基础01
CSS简介: CSS是层叠样式表的简称,有时也会称之为CSS样式表或级联样式表.CSS也是一种标记语言(和html一样,不是个编程语言): Html主要是页面结构,显示元素内容,CSS是美化页面,布局 ...
- 从头学前端-CSS基础02
一个工具: 前端快速开发插件Emmet Emmet 的前身就是 Zen Coding. 它是一组专门用来提高编写 HTML 和 CSS 代码速度的便利工具.将它整合进文本编辑器,可以提供一些功能和快捷 ...
- 前端 CSS 基础笔记
CSS入门 一.CSS简介 1.什么是CSS CSS:Cascading Style Sheet 层叠样式表 是一组样式设置的规则,用于控制页面的外观样式 二.基本用法 1.css语法 <hea ...
- web前端---css基础
一.CSS技术 1.什么是CSS CSS全称叫做层叠样式表stylesheet,是用来修饰HTML网页的一门技术,增强网页的展示能力. 主要是使用CSS属性来实现,最终可以将css代码和HTML网页代 ...
最新文章
- scrum敏捷开发工具实践分享
- 创建符合标准的、有语意的HTML页面——ASP.NET 2.0 CSS Friendly Control Adapters 1.0发布...
- 【Spark亚太研究院系列丛书】Spark实战高手之路-第一章 构建Spark集群(第二步)(4)...
- 6_程序员最常用的快捷键的都在这里啦 (哈哈,我不是)(20181208)
- Unix哲学,Microservices和DDD (2)
- vue商城项目源码_CMS全栈项目之Vue和React篇(下)(含源码)
- Build 2019:微软正式宣布 .NET 5
- 安全中心登录_放心使用instagram需要做到的5个信息安全设置
- 结合Android源码分析总结单例模式的几种实现方式
- php 框架测试,PHP测试框架PHPUnit组织测试操作示例
- Quartus II 之1位全加器
- java 下载指定路径_用java流的方式怎么指定下载到指定目录下
- NMOS和PMOS电流流向以及导通条件
- WIFI参数Beacon Interval、DTIM、Fragment Length、RTS Length
- 计算机配置怎么造假,骗局揭秘:卖你一台假电脑 再送你一个假鲁大师
- 一个全网最详细 Python 教程,不信你来学一学!
- 初级程序员需要掌握的知识
- aardio 多线程开发入门
- 逐点插入法-delaunay三角剖分
- 马上6等待服务器响应,解决网页响应慢,等待时间过长,waiting(TTFB)时间过长...