2016年11月19号，计划把基础在看一下，听大神说好的东西就要多看几遍，知识是学来用的解决问题的，加油

接下来的是我在自学中的小笔记吧，每天都在保持几个小时的学习思考状态，由于要升本所以学前端的时间相对分的有点少，不求进度有多快，只愿能有收获。如这里面有错误，望提出，我再加以修改，谢谢了。

总结学习知识（工欲善其事，必先利其器：浏览器Opera、IE、Google、火狐；开发工具：Notepad++、或者自带记事本）

1、html部分：html的全部语法，主要结构，超链接和常用标记语言

2、css部分：css的三种选择器的使用，使用Div+css进行布局，搞清楚浮动问题

一、格式

语法：HTML标记语言(表示网页信息的符号标记语言）

可以设置文本的格式、创建列表、插入图像和媒体、建立表格、超链接可以使用鼠标点击超链接来实现网页之间的跳转。

标记和属性：保存格式(.html  .htm  .xhtml)

属性格式<标记 属性1=属性值 属性2=属性值  属性3=属性值.......>

不区分大小写，一般写小写；注释<！——......——>；空格键和回车键不会影响网页，无论加多少空格键，但是只会有一个空格，回车但是会显示多行；tab可以缩进；字符实体如空格、小于号...;

二、基本结构

<html>...</html>

开始标记，位于网页的最前端和最后端

<head>...</head>

头信息标记，头标记，开始标记，主要用来包含文件的标准信息，如关键字，标题，不会在浏览其中显示

<title>...</title>

标题标记，一般不能太长，不能包含其他标记，放在head元素里面

<body>...</body>

主体标记，构成我们所看成的标记，bgcolor背景颜色、text字体颜色、link超链接颜色、alink正在访问的颜色、vlik访问过的颜色

<meta>... </meta>

页面的元信息（meta-information）；

功能：提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词；

必须属性：content 值：same_text,比如name属性相关的元信息；

常见属性1、author 2、keywords 3、description 4、others

把content属性关联到一个名称，比如描绘出网页的关键词：<meta name="keywords" content="博客园 博客">；

注意meta标记必须放在head元素里面。

三、文档设置标记—格式标记（<br>、<p>、<center>、<pre>、<li>、<ul>、<dl>、<dt>、<dd>、<hr>、<div>）

<br>强制换行    <p>换段落标记    <center>居中对齐标   <pre>预格式化标记：保留排好的格式    <li>列表项目标记，有value属性   <ul>无序列表标记   <ol>有序列表标记，可以有type属性

< dl>、<dt>、<dd>定义型

四、文档设置标记—文本标记（<hn>、<font>、<b><i><sub><tt><cite><em><strong><small><big><u>）

五、图像标记（img）

六、超链接的使用（a）

七、html表格（<table>、<caption>、<tr>、<th>、<td>）

table属性

2 caption、3 tr属性

td th属性

八、html框架（<frame>、<frameset>）

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

九、html表单设计（<form><input><select>）

十、使用css样式的方法

十一、css样式表(标签选择器、class选择器、ID选择器、组合选择器、伪类选择器以及优先级问题)

十二、css属性（网页中的颜色属性、字体属性、背景属性、文本属性、边框属性）

十三、Div+css布局（盒模型、布局相关属性：定位、浮动、显示、溢出）

十四、实战（简单的企业网站首页）

html+css基础篇的更多相关文章

  1. CSS基础篇之了解CSS和它的基本属性

    CSS是什么? CSS英文全名是Cascading Style Sheets翻译过来就是层叠样式表,它主是把网页表现与内容分离的一种样式设计语言.这种语言能优化我们编程,把东西简化和优化写法,而且不同 ...

  2. html/css基础篇——iframe和frame的区别【转】

    转自共享圈的使用iframe的优缺点,为什么少用iframe以及iframe和frame的区别.其中本人不认同的地方有做小修改 注:HTML5不再支持使用frame,iframe只有src 属性 一. ...

  3. html/css基础篇——DOM中关于脱离文档流的几种情况分析

    所谓的文档流,指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列.并最终窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素.脱离文档流即是元素打乱了这个排列,或是从排版中拿走. ...

  4. 前端面试题——html与css基础篇

    整理一波html和css的面试题,侧重基础,希望明天面试能用到~(╥╯^╰╥) 一.HTML部分 1.浏览器页面有哪三层构成,分别是什么,作用是什么? 构成:结构层.表示层.行为层分别是:HTML.C ...

  5. CSS 基础篇、绝对有你想要

    本章内容: 简介 CSS 定义 四种引入方式 样式应用的顺序 选择器(Selector) * 通用元素选择器 标签选择器 class 类选择器 # ID选择器 , 多元素选择器 后代元素选择器 > ...

  6. CSS基础篇之背景、过渡动画

    background-origin(背景原点) 设置元素背景图片的原始起始位置.必须保证背景是background-repeat为no-repeat属性才能生效. background-origin: ...

  7. CSS基础篇之选择符3

    border(边框) 如何用CSS调出边框 我们给p标签加一个边框试一下 p{ border:1px solid #ccc:/*这是缩写*/ } 第一个值是为边框的宽度 第二个值是为边框线样式为直线 ...

  8. CSS基础篇之选择符

    关系选择符 E F 包含选择符(Descendant combinator) CSS1 选择所有被E元素包含的F元素. <html> <head> <meta chars ...

  9. html/css基础篇——link和@inport详解以及脚本执行顺序探讨

    先说一说两者之间的异同 两者都可以引用外部CSS的方式,现在主流浏览器两者都支持(ps:@import是CSS2.1提出的),但是存在一定的区别: 1.link是XHTML标签,除了加载CSS外,还可 ...

随机推荐

  1. Extjs表单控件入门

    ExtJs表单控件用formPanel来做为表单元素的容器.默认情况下,是使用Ajax异步提交. 大家知道要使用Extjs必须引入他的库,所以我们要引入以下几个文件: ext-all.css ext- ...

  2. 苹果推送通知服务Push Notification探究总结（序）

    刚才发了两篇几个月前写的文档,觉得太敷衍了,想了想,还是来一发实在的. 再者,刚好上周研究了苹果的推送通知服务Push Notification,还是很有心得的,赶紧趁热打铁,记录一下,望与大家谈论下 ...

  3. WPF专业编程指南 - 那些根元素<>的解释

    <Window x:Class="Chapter1_WpfApplication1.MainWindow" xmlns="http://schemas.micros ...

  4. 揭开redis神秘面纱

    一直听别人说NoSQL,以前一直不明白,这到底是什么东西,今天听过我们涛哥的讲解,略有小感,特此小记. NoSQL(NoSQL = Not Only SQL),意为反SQL运动,是一项全新的数据库革命 ...

  5. MyEclipse从数据库表反向生成实体类之Hibernate方式（反向工程）

    一.打开Myeclipse Database Explorer 二.新建[New..] 三.选择数据库,添加驱动 四.测试连接 五.选中数据库中的表单击右键选择[Hibernate Rever..] ...

  6. sql server DateTime相关内置函数总结

    本文部分内容参考msdn帮助文档和博客园!汇总备忘 1.获取当前日期      getdate()函数以datetime数据类型的格式返回当前SQLServer服务器所在计算机的日期和时间.其语法格式 ...

  7. 为什么不能在子类或外部发布C#事件

    为什么不能在子类或外部发布C#事件 背景 一个朋友问了一个问题:“为什么不能在子类或外部发布C#事件?”,我说我不知道,要看看生产的IL代码,下面我们看看. 测试 代码 1 using System; ...

  8. php的数组与字符串的转换函数整理

    1.将一个字符串转化为数组 str_split()用于将一个字符串转化为数组 语法: str_split(string,length) //string是必须的,是要分割的字符串: //length是 ...

  9. 代码创建 WPF 旋转动画

    一.WPF窗体上有一个名为rectangle2的矩形 对应的XAML如下: <Window x:Class="WpfVideo.Window1"         xmlns= ...

  10. Cloudera Development Kit(CDK) 简介

    Cloudera Development Kit(CDK) 简介 guibin.beijing@gmail.com 2013.07.02 CDK简介 CDK(Cloudera Development ...