问题:

1.css中table{border:1px;}是定义table的样式,只有表格的外边框,不能实现<table border="1"></table>(单元格边框)的效果。

  通过css设置表格(单元格)边框的代码示例:

 /*方法一:通过设置td边距实现效果*/
table{
border-collapse: collapse;
}
td{
border:1px solid #ccc;
}
/*通过table和td的背景颜色设置边框*/
table{
background:red;
}
td{
background: #FFFFFF;
border-spacing: 1px;
}

2.在设置多个父级div,内嵌多个浮动子级div时,没有对父级div设置高度,导致位置错乱。

3.对列表标签ul/ol设置list-style-position:inside,可使列表前缀在li里面,方便加边框等样式。

4.同一标签,同时有id选择器和class选择器,class在上,id在下定义相同样式时为id样式;id在上,class在下时同样为id样式。--id优先级大于class

5.代码管理,文件类型要分开

6.id和class起名字注意命名规范:字母数字下划线,数字不能开头

7.文件名不要是中文

内容整理:

关于css:

  css注释:/*注释内容 */

  内联(行内):写在标签里面,以属性的形式,属性名是style。  //优先级最高,不推荐。

  内嵌:写在head标签内,以标签的形式,标签名是style。   //写法:选择器{ 样式 } 

  外部:写在head标签内,以标签的形式,标签名是link

    <link rel="stylesheet" href="*.css" />

选择器:

  标签选择器:根据标签名找  //p{}  div{}

  id选择器:根据id的属性值来找元素  //id的属性值   #id

  class选择器:根据class的属性值来找元素  //class的属性值  .class

  并列:选择器1,选择器2{}  //关键符号  ,

  后代:父选择器 子选择器  //关键符号 空格

  *{}:所有

背景:background

  body{background:#fff url("img.img") no-repeat right top;}

  简写属性值的顺序:

  background-color:背景颜色

  background-image:背景图像

  background-repeat:背景图片的平铺  //水平、竖直、不平铺...

  background-attachment:背景图像随页面其他部分的滚动或固定  //默认scroll滚动

  background-position:背景图像的位置  //可设置px和百分比,默认先上下再左右,与边距的设置相反

  另外:background-size:背景图像的缩放

文本:text

  color:文本颜色

  direction:文本方向  //横向/竖向

  letter-spacing:字符间距  //abc  a b c

  line-height:行高  //经常用来设置文本的垂直居中,最好对一行使用,如果有换行会影响标签高度

  text-align:文本的对齐方式  //居中,左对齐,右对齐,两端对齐

  text-decoration:修饰文本  //下划线(非链接文本不建议使用),上划线,删除线

  text-indent:首行缩进  //可设置px和em;2em=当前字号的两个字符

  text-shadow:文本阴影

  vertical-align:文本的垂直对齐  //top、middle、bottom

  word-spacing:设置字间距

字体:fonts

  font-family:字体

  font-size:字号

  font-style:字体样式  //默认normal;italic:斜体;oblique:倾斜(字体没有斜体时浏览器可仿oblique实现效果)

  font-weight:字体的粗细  //实现<b></b>的效果,100-700

0312-css样式(选择器、文本text、字体fonts、背景background)的更多相关文章

  1. JS实战 · 仿css样式选择器

    代码如下: <html> <head>     <meta http-equiv="Content-Type" content="text/ ...

  2. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  3. CSS样式选择器

    <!-- css样式选择器 HTML选择器 类选择器 ID选择器 关联选择器 组合选择器 伪元素选择器 selector{ /* selector是样式选择器 property:value; / ...

  4. 前端基础:CSS样式选择器

    前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...

  5. 在线生成CSS样式和兼容的字体格式

    http://www.fontsquirrel.com/tools/webfont-generator 在线生成CSS样式和兼容的字体格式.

  6. css 样式控制文本过长实现省略号

    css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...

  7. 【CSS复合选择器、元素显示模式、背景】前端小抄(3) - Pink老师自学笔记

    [CSS复合选择器.元素显示模式.背景]前端小抄(3) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS的复合选择器 1.1 什么是复合选择器 在 CSS 中,可以根据选 ...

  8. html添加css——样式选择器

    如何给html添加样式.两种方法: 一.新建立一个css样式表,与原html同目录,然后通过link标签链接.如:<link type="text/css" rel=&quo ...

  9. Web前端新人之CSS样式选择器

    最近在学习css样式.那么我就想先整理一下css样式的选择器 规则结构: 每个规则都有两个基本部分:选择器和声明块.声明块由一个或者多个声明组成,每个声明则是一个属性—值对(property-valu ...

  10. css样式——选择器(三)

    https://www.cnblogs.com/haiyan123/p/7552235.html 1.怎么找到标签 2.如何操作标签的对象 一.css概述 CSS是Cascading Style Sh ...

随机推荐

  1. HA集群heartbeat配置--Nginx

    HA即(high available)高可用,又被叫做双机热备,用于关键性业务.简单理解就是,两台机器A和B,正常是A提供服务,B待命限制,当A宕机或服务宕掉,会切换至B机器继续提供服务.常用实现高可 ...

  2. Dynamics 365 for CRM: Sitemap站点图的可视化编辑功能

    Dynamics 365 for CRM 提供了Sitemap站点图的可视化编辑功能 在之前的所有版本中,我们只能通过从系统中导出站点图的XML进行编辑后再导入(容易出错),或使用第三方的Sitema ...

  3. 基于bootstrap的表格数据展示

    一.导入bootstrap文件 二.前端html代码 对应的是前台条件查询和js数据获取 js数据获取部分在第四段 三.后台数据 total为集合总数  int类型 rows为前台需要展示的数据集合 ...

  4. JSP、Servlet、JDBC学习笔记

    WEB的学习 * 服务器 * 网络的架构(面试题) * C/S client/server 客户端/服务器端 例子:QQ 快播 暴风影音 * 优点:交互性好,服务器压力小. * 缺点:客户端更新了,下 ...

  5. Mybash的实现

    Mybash的实现 要求: 使用fork,exec,wait实现mybash 写出伪代码,产品代码和测试代码 发表知识理解,实现过程和问题解决的博客(包含代码托管链接) 背景知识 1. fork 使用 ...

  6. 201621123062《java程序设计》第九周作业总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 思维导图1:(对集合部分做了一些改动和细化) 思维导图2:(泛型) 1.2 选做:收集你认为有用的代码片段 代 ...

  7. Beta阶段敏捷冲刺报告-DAY3

    Beta阶段敏捷冲刺报告-DAY3 Scrum Meeting 敏捷开发日期 2017.11.4 会议时间 12:30 会议地点 软工所 参会人员 全体成员 会议内容 当天任务确认,进度调整, 讨论时 ...

  8. 1013团队Beta冲刺day4

    项目进展 李明皇 今天解决的进度 因服务器端未完成登录态维护,故无法进行前后端联动. 明天安排 前后端联动调试 林翔 今天解决的进度 因上课和实验室事务未完成登录态维护 明天安排 完成登录态维护 孙敏 ...

  9. java实现找一个数范围内所有的一

    一.题目内容 给定一个十进制的正整数,写下从1开始,到N的所有整数,然后数一下其中出现“1”的个数.要求:写一个函数 f(N) ,返回1 到 N 之间出现的 “1”的个数.例如 f(12)  = 5. ...

  10. C# Unity游戏开发——Excel中的数据是如何到游戏中的 (四)2018.4.3更新

    本帖是延续的:C# Unity游戏开发--Excel中的数据是如何到游戏中的 (三) 最近项目不算太忙,终于有时间更新博客了.关于数据处理这个主题前面的(一)(二)(三)基本上算是一个完整的静态数据处 ...