CSS的简单复习总结
如果说网页是人的话那么CSS就是化妆品了哈哈哈,所以网页离不开CSS的装饰。
id选择器和Class选择器 二者都是用来选择元素进行装饰的,我个人理解是类选择器包含了id选择器,class选择器不进能选出单个元素还能还能选出一类元素。
外部样式表 在外部进行编写代码在网站的代码进行调用
内部样式表 在网页的<head>中用加<style>然后用类选择器来调用
内联样式表 在标签中加style就能直接修饰
背景(background) background-color 背景颜色
background-image 背景图片
background-repeat 背景图片平铺 如:background-repeat:no-repeat 、background-repeat:repeat-x
background-attachment 背景图片固定 如:background-attachment:pixed
文本(text) color 文本颜色
text-align 文本对齐方式 如:text-align:center 、 text-align:right 、 text-align:justify
text-decoration 文本修饰 如:text-decoration:none(删除下划线)
text-transform 文本转换 如:text-transform:overline 、 text-transform:line-through 、 text-transform:upperline
text-indent 文本缩进 如:text-indent:20px
还有一些拓展的 letter-spaing 字符之间的距离
line-height 行与行之间的高度
direction 文本书写方向 如:direction:rtl 从右往左写
word-spacing 增加单词之间的空白空间
white-space:nowrap 禁用文本环绕(就是把多行文本写成一行)
text-shadow 增加阴影效果 如:text-shadow:2px 2px #FF0000
字体(fonts) font-family 字体属性
font-style 字体样式
font-size 字体大小
font-weight 字体的粗细 字体变细font-weight:lighter 变粗font-weight:500
链接(link)
a:link {color:#000000;} /* 未访问链接*/
a:visited {color:#00FF00;} /* 已访问链接 */
a:hover {color:#FF00FF;} /* 鼠标移动到链接上 */
a:active {color:#0000FF;} /* 鼠标点击时 */
color
text-decoration
background-color
CSS的简单复习总结的更多相关文章
- css重点章节复习—布局-边框-边距-浮动 (部分)
css重点章节复习—布局-边框-边距-浮动 在第二个任务中,这一块的后面那条线真的弄了很久.起初也是在html里面写的代码.之后觉得这样不好,想到第一个页面中用到的border-bottom和bord ...
- CSS绘制简单图形
究竟该用字体图标.图片图标.还是CSS画一个图标?我也不知道.各有千秋吧.本文将介绍如何用css绘制简单的图形,所有测试在chrome58.0完成,如果你不能得到正确结果请到caniuse查一查看看是 ...
- Html5 和 CSS的简单应用
本文是利用几个简单的小例子,来实现html+css的简单应用. 菱形链接菜单 本例是采用html5+css3.0设置的菜单链接.其中主要用到了以下几个方面: CSS3.0中的2D变换,如:旋转tran ...
- html css的简单学习(三)
html css的简单学习(三) 前端开发工具:Dreamweaver.Hbuilder.WebStorm.Sublime.PhpStorm...=========================== ...
- html css的简单学习(二)
html css的简单学习(二) <!Doctype html>告诉浏览器,这是一个html文档.lang="en" 默认是en,表示英语:zh-Hans 中文简体:z ...
- html css的简单学习
html css的简单学习 css的内边距:padding (auto.length.%)(顺序:上.右.下.左)padding-toppadding-leftpadding-rightpadding ...
- css实现简单的告警提示动画效果
需求:css实现简单的告警提示动画效果,当接收到实时信息的时候,页面弹出告警信息的动画效果 <!DOCTYPE html> <html lang="en"> ...
- css实现简单音乐符效果
css实现简单音乐符效果 利用css3中的transform.animation.keyframes实现 <!DOCTYPE html> <html lang="en&qu ...
- koa2入门--01.ES6简单复习、koa2安装以及例子
1.ES6简单复习 /*let 和 const: let用于定义一个块作用域的变量,const 定义一个常量 */ let a = 'test'; const b = 2; /*对象的属性和方法的简写 ...
随机推荐
- Windows的奇巧淫技(为什么GIF显示不出来??)
谁的电脑里没点小秘密?东藏西藏到最后自己都找不到了有木有?今天教大家个隐藏文件的高招: 将任意文件隐藏到图片中!怎么样?再也不用建什么「马列主义哲学」的文件夹啦!
- day_5字符串和列表的各种操作方法
字符串类型: 字符串的定义是可以有多种引号嵌套 定义字符串是以开头的引号然后匹配和第一个引号相同的引号,所以当字符串中间出现和第一个引号相同的引号就会出错,这个时候就可以选择别的引号进行创建字符串,或 ...
- CLion之C++框架篇-优化框架,单元测试(二)
背景 结合上一篇CLion之C++框架篇-安装工具,基础框架的搭建(一),继续进行框架优化! googletest(GTest)是Google开源的C++测试框架,与CLion组合,对C++环 ...
- Akka-CQRS(2)- 安装部署cassandra cluster,ubuntu-16.04.1-LTS and MacOS mojave
对于akka-cluster这样的分布式软件系统来说,选择配套的数据库类型也是比较讲究的,最好也是分布式的,如cassandra,能保证良好的HA特性.前面的例子里示范akka-persistence ...
- 第89节:Java中的反射技术
第89节:Java中的反射技术 反射技术是动态的获取指定的类,和动态的调用类中的内容(没有类前就可以创建对象,将对象的动作完成,这就是动态的获取指定的类). 配置文件把具体实现的类名称定义到配置文件中 ...
- Dash by Plotly 学习笔记
一.介绍 1.dash 是什么 dash 是一个基于 Flask (Python) + React 的 web 框架. 入门指南:https://dash.plot.ly/getting-starte ...
- rgba()和opacity之间的区别(面试题)
rgba()和opacity之间的区别: 相同点:rgba()和opacity都能实现透明效果: 不同点:opacity作用于元素,以及元素中所有的内容: rgba()只用于于元素的颜色,及背景色: ...
- 基于python的OpenCV图像1
目录 1. 读入图片并显示 import cv2 img = cv2.imread("longmao.jpg") cv2.imshow("longmao", i ...
- Jexus使用的相关记录
前言 本文是零零散散的记录,部分内容是我在平时工作中用到的,部分是从群里"偷"来的,所以难免会有一些错误. 主要还是希望能帮到部分使用Jexus的朋友. 安装 curl https ...
- Java线程之 InterruptedException 异常
Java线程之 InterruptedException 异常 当一个方法后面声明可能会抛出InterruptedException 异常时,说明该方法是可能会花一点时间,但是可以取消的方法. 抛 ...