diV有 Class、Style、title、ID 等属性。

1.margin 空出边缘

margin:上 下 左 右(按顺时针顺序,缺少某一方向则对称)

2.border 边框(三要素:像素 形状 颜色)

border-top : 1px solid black 上框

border-bottom : 1px solid #6699cc 下框

border-left : 1px solid #6699cc 左框

border-right : 1px solid #6699cc 右框

border: 1px solid #6699cc 四边框

3.background 背景

text-decoration: none;">black 背景颜色

background-image : url(image/bg.gif) 背景图片

background-attachment : fixed 固定背景

background-repeat : repeat 重复排列-网页预设

background-repeat : no-repeat 不重复排列

background-repeat : repeat-x 在x轴重复排列

background-repeat : repeat-y 在y轴重复排列

background-position : 90% 90% 背景图片x与y轴的位置

over-flow: hidden ,让超出的部分隐藏。

4.浮动和清除浮动

float: left;  //左浮动

clear: left;  //清除该位置左浮动

5.常见的块状元素与内联元素

块状元素
内联元素

address – 地址

blockquote – 块引用

center – 居中对齐

dir – 目录列表

div – 常用块级容易,也是CSS layout的主要标签

dl – 定义列表

fieldset – form控制组

form – 交互表单

h1 – 大标题

h2 – 副标题

h3 – 3级标题

h4 – 4级标题

h5 – 5级标题

h6 – 6级标题

hr – 水平分隔线

isindex – input prompt

menu – 菜单列表

noframes – frames可选内容,(对于不支持frame的浏览器显示此区块内容

noscript – 可选脚本内容(对于不支持script的浏览器显示此内容)

ol – 有序表单

p – 段落

pre – 格式化文本

table – 表格

ul – 无序列表

a – 锚点

abbr – 缩写

acronym – 首字

b – 粗体(不推荐)

bdo – bidi override

big – 大字体

br – 换行

cite – 引用

code – 计算机代码(在引用源码的时候需要)

dfn – 定义字段

em – 强调

font – 字体设定(不推荐)

i – 斜体

img – 图片

input – 输入框

kbd – 定义键盘文本

label – 表格标签

q – 短引用

s – 中划线(不推荐)

samp – 定义范例计算机代码

select – 项目选择

small – 小字体文本

span – 常用内联容器,定义文本内区块

strike – 中划线

strong – 粗体强调

sub – 下标

sup – 上标

textarea – 多行文本输入框

tt – 电传文本

u – 下划线

var – 定义变量

html&&css 基础知识笔记的更多相关文章

  1. CSS基础知识笔记(三)

    继承 继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代.比如下面代码:如某种颜色应用于p标签,这个颜色设置不仅应用p标签,还应用于p标签中的所有子元素文本,这里子元素为s ...

  2. CSS基础知识笔记(二)之选择器

    CSS选择器 选择器{ 样式; } 每一条css样式声明(定义)由两部分组成,形式如下: 在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元 ...

  3. CSS基础知识笔记(一)

    css 样式由选择符和声明组成,而声明又由属性和值组成: 选择符: 又称选择器,指明网页中要应用样式规则的元素,如本例中是网页中所有的段(p)的文字将变成蓝色,而其他的元素(如ol)不会受到影响. 声 ...

  4. CSS基础知识笔记(四)

    元素分类 标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1>...<h6& ...

  5. 〖前端开发〗HTML/CSS基础知识学习笔记

    经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...

  6. CSS基础知识之position

    最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...

  7. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  8. CSS基础知识之float

    前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...

  9. (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...

随机推荐

  1. 用phpstudy搭建dedecms网站验证码出不来解决方案

    验证码图片不显示,这应该是很多站长朋友们最长遇到的一个问题,本地测试明明好好的,为什么传上空间或者服务器上验证码就无法显示了呢,春哥分析这可能是由于没有加载gd库扩展所引起的,那么怎么解决呢?由于引起 ...

  2. PHP个人常用函数封装

    function GetIP(){ if(!empty($_SERVER["HTTP_CLIENT_IP"])){ $cip = $_SERVER["HTTP_CLIEN ...

  3. UL/LI

    如何用CSS制作横向菜单 让ul li横向排列及圆点处理    我们先建立一个无序列表,来建立菜单的结构.代码是: <ul><li><a href="1&quo ...

  4. [转]Android下打印调试堆栈方法

    http://blog.csdn.net/freshui/article/details/9456889 打印堆栈是调试的常用方法,一般在系统异常时,我们可以将异常情况下的堆栈打印出来,这样十分方便错 ...

  5. PAT (Advanced Level) 1090. Highest Price in Supply Chain (25)

    简单dfs. #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> ...

  6. 第三方框架ViewPagerIndicator引入到Android Studio的方法总结

    原创文章,转载请注明出处http://www.cnblogs.com/baipengzhan/p/6286619.html 第三方框架ViewPagerIndicator实现的效果比较好,但当我们从G ...

  7. thinkphp 5.0 命名空间

    命名空间 命名空间 ThinkPHP5采用命名空间方式定义和自动加载类库文件,有效的解决了多模块和Composer类库之间的命名空间冲突问题,并且实现了更加高效的类库自动加载机制. 如果不清楚命名空间 ...

  8. 转Y-slow23原则(雅虎)

    YslowYahoo发布的一款基于FireFox的插件,主要是为了提高网页性能而设计的,下面是它提倡了23条规则,还是很不错的,分享一下: 1.减少HTTP请求次数 合并图片.CSS.JS,改进首次访 ...

  9. HTTP Request header

    HTTP Request header HTTP协议详解 - 小坦克 - 博客园 HTTP Request header 当今web程序的开发技术真是百家争鸣,ASP.NET, PHP, JSP,Pe ...

  10. STL中map的一个知识点

    问题背景 在做USACO Section 1.1 Greedy Gift Givers的时候,我最初的想法是直接用一个map来进行数据处理.但是后来产生一个让我感到疑问的地方,后来我经过测试,发现了这 ...