HTML+CSS零基础学习笔记

课程来自慕客网:http://www.imooc.com/code/49

另外有网易coursera合作的课程:网络技巧 - 网络技术和HTML5简介

W3school:

提前准备:安装Dreamweaver 6

点击安装Dreamweaver 6 亲测破解版可用,算是这两天最大的收获了。

注意:安装中自己碰到了两个问题,解决办法如下:

1-安装到一半提示需要重启电脑。

    原因:之前安装不成功留下了记录

解决办法:进入注册表删除注册不成功记录

2-安装提示连接不上网络

    原因:不知

    解决办法:先断网,然后再运行安装。(坑爹啊,连着网的时候提示连接不上网络;断网之后,反而安装成功了)

2015-1-20 学习笔记

1-1:代码初体验

1-2:html 和 CSS的关系:内容和表达形式的关系

1-3&1-4: 标签以及标签的写法

1-5:html 语言的基本结构:

       

         

         

       

1-6:文档头:,包含文档的基本信息,如title等,但一般不会展示给用户看。

1-7:代码注释方式:

2-1:语义化

2-2:容纳具体网站内容的标签:

2-3:分段标签:

2-4:字体大小:

->

2-5: 这是斜体这是加粗

2-6:用span设置文本格式:

    a-先设定span的意思:比如“蓝色”

     

        b-指定应用范围: 文本

2-7:一句话的引用:

2-8:长段文章引用:

2-9:使用
标签分行显示文本

2-10:添加空格: 

2-11: 加入分隔线:


或者
, 空标签

2-12: 加入地址标签(变斜体):

2-13: 加入一句代码标签:

2-14:保留原文本格式(加入大段代码)标签:

         

3-1:信息列表:

                                 

  •                        

3-2:ol 有序信息列表:

                                             

  1.                                      

3-3:

逻辑板块分类(division)

3-4:给DIV命名

2015-1-21 学习笔记

3-5表格标签:

     

     <--!以下是表头,一般表头默认为一行,由任意个表格组成-->

     

     

     

这是表格

     

      <--!以下是表格内容,默认为一行,由任意个表格组成-->

     

内容

3-6 用CSS样式,为表格添加边框

     

3-7:表格摘要及标题:

     

     

4-1:认识标签,链接到另外一个页面,默认为在原有浏览器打开

       展示的文本

比如:点击这里

4-2: 在新建浏览器打开页面:目标网址后+ target="_blank"

4-3:使用mailto 发送邮件,更多详细说明点击这里

1-22 学习笔记

5-1 表单文件

举例:

       

         

              

5-2 文本输入框 密码输入框

             

当type="text"时,输入框为文本输入框.当type="password"时,输入框为密码输入框。

5-3 文本域,支持多行文本输入

5-4 单选框,复选框

    1、type:

      当type="radio"时,控件为单选框.name取值一定要一致,这样才能起到单选作用。

      当type="checkbox"时,控件为复选框

    2、value:提交数据到服务器的值(后台程序PHP使用)

    3、name:为控件命名,以备后台程序ASP、PHP使用

    4、checked:当设置checked="checked"时,该选项被默认选中

5-5 使用下拉表框进行单选,节省空间

selected 属性为默认选择,使用方法:selected="selected".

5-6 使用下拉表框进行多选

5-8 使用重置按钮,重置表单信息


5-9 form表单中的label标签

1-23 学习日志

6-1: 认识CSS

CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。

6-2:CSS的优势

为什么使用css样式来设置网页的外观样式呢?右边编辑器是一段文字,我们想把“超酷的互联网”、“服务及时贴心”、“有趣易学”这三个短语的文本颜色设置为红色,这时就 可以通过设置样式来设置,而且只需要编写一条css样式语句。

第一步:把这三个短语用括起来。(见右边代码编辑器13行)

第二步:写入下列代码:span{ color:red;}

6-3:CSS语法

css 样式由选择符和声明组成,而声明又由属性和值组成。如图所示。

声明:在英文大括号“{}”中的的就是声明,属性和值之间用英文冒号“:”分隔。当有多条声明时,中间可以英文分号“;”分隔,如下所示:

p{color:blue;fontsize:12px;

6-4: 注释代码 /*文字内容*/

7-1内联式:

这里文字是红色。


7-2嵌入式:嵌入式css样式,就是可以把css样式代码写在标签之间。

7-3 外部式:

外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在内(不是在

4-插入图像作为超链接:

您也可以使用图像来作链接:

我们通过使用 标签在 HTML 中创建链接。

有两种使用 标签的方式:

通过使用 href 属性 - 创建指向另一个文档的链接

通过使用 name 属性 - 创建文档内的书签

5-设置图像在文本中对齐

, 还可以用  middle, top.

6-图片浮动

, 还可以用 right

7-改变图片大小

8-无法显示图片时(比如由于浏览器不兼容),可以显示替换文本

向左转

你可能感兴趣的:(HTML+CSS零基础学习笔记)

标题