A--看的东西多了总会出现好多模糊不清的又长的很像的的词语 今天对此进行区别分析下

1. align 与 text-align的区别

align 在W3Cschool中是这样解释的  ----align 属性规定表格相对于周围元素的对齐方式。  通常来说,HTML 表格的前后都会出现折行。通过运用 align 属性,可实现其他                 HTML 元素围绕表格的效果。

text-align  在CSS2.0中是这样解释的 ---设置或检索对象中文本的对齐方式。

用自己的话描述就是

align 作为HTML标签属性使用,一般表格中应用较多

text-align 是 css 种的属性

2.bgcolor与background的区别

W3Cschool中的描述

背景颜色(Bgcolor)

背景颜色属性将背景设置为某种颜色。属性值可以是十六进制数、RGB 值或颜色名。

背景(Background)

背景属性将背景设置为图像。属性值为图像的URL。如果图像尺寸小于浏览器窗口,那么图像将在整个浏览器窗口进行复制。

B--做了task1—2的体会最深的就是如何布局是这个任务的核心,先不说里面的CSS样式的设置,总结下布局问题

1、传统的页面布局方式,其实就是使用table 表格来实现,充分利用表格单元格的原理。

2、现在的布局都是从table演进成使用div来设置,但其布局思路是一样的,将网页的每个模块看作是table的单元格,排版思路抓住这两点:

(1)从大到小排版

把一个整体划分成各个小模块,细小划   套用一个词 叫 逐步求精

(2)从左到右,从上到小排版

C-- 继续补充

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素内联元素(又叫行内元素)内联块状元素

1、块级元素特点:

(1)每个块级元素都从新的一行开始,并且其后的元素也另起一行。(真霸道,一个块级元素独占一行)

(2)元素的高度、宽度、行高以及顶和底边距都可设置。

(3)元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。

       常用的块状元素有

<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>

 2、内联元素特点:

(1)和其他元素都在一行上;

(2)元素的高度、宽度及顶部和底部边距不可设置;

(3)元素的宽度就是它包含的文字或图片的宽度,不可改变。

     常用的内联元素有:

<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

3、内联块状元素特点:

(1)和其他元素都在一行上;

(2)元素的高度、宽度、行高以及顶和底边距都可设置

   常用的内联块状元素有:

<img>、<input>

三者之间的转换:

块级元素设置为内联元素 display:inline 

将元素设置为内联块状元素 display:inline-block

内联元素转换为块状元素 display:block

No.3小白的HTML+CSS心得篇的更多相关文章

  1. No.1小白的HTML+CSS心得篇

    一个web前端的小白,听前辈说写好笔记很关键,so 特此用博客来开始记录自己的旅程——Web之路 最近几天看的HTML 1.纠正一个认知错误 “HTML是一种编程语言”  ————(错) HTML ( ...

  2. No.4小白的HTML+CSS心得篇

    书读百遍,其义自见 遵照这句话 今天再次重新把慕课网的HTML+CSS看了一遍,再次阅读感受不再是那么陌生,从而心里默默地喜欢上了这种方式,坚持. 好了,开始今天的收获小总结 1.html中,表单&l ...

  3. No.2小白的HTML+CSS心得篇

    今天要强调的重点是分析把握好HTML标签的两个方面: 1.标签的用途(用途指的是用来干什么,有什么作用)在专业术语叫作 语义化. 举个列子:<br/> 换行的作用 见了它就明白它的语义就是 ...

  4. 深入css布局篇(3)完结 — margin问题与格式化上下文

    深入css布局(3) - margin问题与格式化上下文      在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重要的点.今天我们来深入学习一下 ...

  5. 深入css布局篇(2) — 定位与浮动

    深入css布局(2) - 定位与浮动      在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重要的点.今天我们来深入学习一下css布局相关的知识 ...

  6. 小白学Docker之基础篇

    系列文章: 小白学Docker之基础篇 小白学Docker之Compose 小白学Docker之Swarm PS: 以下是个人作为新手小白学习docker的笔记总结 1. docker是什么 百科上的 ...

  7. CSS效果篇--纯CSS+HTML实现checkbox的思路与实例

    checkbox应该是一个比较常用的html功能了,不过浏览器自带的checkbox往往样式不怎么好看,而且不同浏览器效果也不一样.出于美化和统一视觉效果的需求,checkbox的自定义就被提出来了. ...

  8. CSS效果篇--这里有你想要的CSS3漂亮的自定义Checkbox各种复选框

    在原来有一篇文章写到了<CSS效果篇--纯CSS+HTML实现checkbox的思路与实例>.这篇文章主要写各种自定义的checkbox复选框,实现如图所示的复选框: 大致的html代码都 ...

  9. 我的web前端自学之路-心得篇:我为什么要学习web前端?

    时光如流水,转眼间,自己已经是大三的学长了,看着一个个学弟学妹,心中有种莫名的感觉,很怀念大学的前两年时光,但也很憧憬着自己的未来,自己将要去经历很多从未经历的事.我是我们学校信科院的一名学生,在编程 ...

随机推荐

  1. 关于Scrapy框架的基本概念

    Scrapy爬取网页基本概念 Scrapy爬取网页基本概念 怎么样用Scrapy生成project? scrapy startproject xxx 如何用Scrapy爬取网页? import scr ...

  2. ThinkPHP第二十四天(JQuery常用方法、TP自动验证)

    ---恢复内容开始--- 1.JQuery常用方法 A:JS中可以用json格式数据当做数组使用,如var validate={username:false,pwd:false,pwded:false ...

  3. 在FL2440上使用kei MDK 调试程序(J-link)

    <一>新建一个工程 单击Project ->New µVision Project...菜单项 <二>选择CPU 这里我们选择三星的2440A 点击OK后会提示你是否添加 ...

  4. uber奖励和账单详解

    为了让各位车主轻松理解奖励政策和账单明细的核算方法,我们特意制作#奖励详解#的专题文章,保证您五分钟内掌握看懂账单的全部要领和诀窍. 第一部分:收入说明 看到收入说明的账单是不是有些晕呢,来来,我们一 ...

  5. GLView基本分析

    GLView是cocos2d-x基于OpenGL ES的调用封装UI库. OpenGL本身是跨平台的计算机图形实现API,在每一个平台的详细实现是不一样.所以每次使用之前先要初始化,去设置平台相关的信 ...

  6. Objective-C分类 (category)和扩展(Extension)

    1.分类(category) 使用Object-C中的分类,是一种编译时的手段,允许我们通过给一个类添加方法来扩充它(但是通过category不能添加新的实例变量),并且我们不需要访问类中的代码就可以 ...

  7. 万圣节福利:红孩儿3D引擎开发课程《3ds max导出插件初步》

    ds max文件夹,插件文件夹以及3ds max的可执行程序文件夹: 位的,这里要改成x64,否则启动程序后3ds max会提示"不是有效的win32程序"之类的对话框. 然后要将 ...

  8. entity framework 中一些常用的函数 转自http://www.cnblogs.com/williamzhu/

    一般查询 var Courses = db.Courses.Where(c => c.Title == "Physics").OrderBy(c => c.Title) ...

  9. 替换Avada主题的Google字体

    刚玩WP的时候图省事,在themeforest买了排行第一的主题Avada,虽然强大,但对我目前的Blog应用而言实在太'重'了.而且老外的主题很多方面不接地气,比如谷歌字体.本文指导各位如何在Ava ...

  10. JavaSE_ 集合框架 总目录(15~18)

    JavaSE学习总结第15天_集合框架1 15.01 对象数组的概述和使用15.02 对象数组的内存图解15.03 集合的由来及与数组的区别15.04 集合的继承体系图解15.05 Collectio ...