前端学习自学笔记:day02

今天是第二天的学习内容笔记,我一般无事都会一直更新下去,直到我前端学的差不多了,我到时候才会转学其他语言,如果在学习中有什么发现,我都会分享上来.

在此之前先为大家显示下前端工程师的路线图:

第二天的笔记:HTML AND CSS:

早上所学的内容

标签:[链接外部的资源和样式

例:

rel:规定当前文档与被链接文档之间的关系。

type:规定被链接文档的 MIME 类型。

href:被链接的文档的位置]

注意:当某种字体不可用时,你可以让浏览器自动降级到另一种字体。

-复习:

width:表示宽度,使用像素px来指定图片的宽度。

例(在类选择器中使用):

.cccc{

width:100px;

}

alt属性(alt text):是当图片无法加载时显示的替代文本。注意:每个图片都应该有alt属性

例:

CSS边框:[属性有:style(样式)、color(颜色)、width(宽度)、height(高度)、border-radius(边框半径)

例:.thin-red-border{

border-color:red;//颜色

border-width:5px;//宽度

border-style:solid;//样式

border-radious:10px;

}

style:solid(固体)

border-radius可以使用百分值来制定边框半径。

例:border-radious:50%;//边框半径为50%时即可成为一个圆形边框。]

注意:可以将多个class应用到一个元素上,只需要在多个class之间用空格隔开。

例:

-复习:a元素,也叫anchor(锚点)元素,既可以用来链接到外部地址实现页面跳转功能,也可以链接到当前页面的

某部分实现内部导航功能。

href代表具体位置

-复习:文件嵌套

例:

注意:当你的a元素没有有链接时,可以使用固定链接,把a元素的href值替换为一个#。

例:

a元素也可以把某元素嵌套进来,将其变成一个链接。

例:

中午所学的内容:

HTML的style属性:

background-color(背景颜色)

例:

注意:旧的背景颜色(bgcolor)不建议使用。

-复习[

font-family (字体样式) 例:

color(文本颜色) 例:

font-size(文本大小) 例:

注意:旧的设置字体方法(标签)不建议使用。]

text-align(文本水平对齐),center:居中对齐

例:

(居中对齐)

注意:旧的设置文本对齐属性(align)不建议使用。

文本格式化标签:

定义粗体文本。例:This is bold

定义大号字。 例:This is big

定义着重文字。例:This is emphasized

定义斜体字。 例:This is italic

定义小号字。 例:This text is small

--复习定义加重语气(加粗字体)。例:This text is strong

定义下标字。 例:subscript

定义上标字。 例:supscript

定义插入字(有下划线的效果)。 例:This is ins

定义删除字(文本有一条划线,表示删除)。 例:This is del

不建议使用的有:、、

预文本格式:

(保留原本在编译器中的文字样子,包括空格都完整保留下来)

例:

这是

预保留格式

它保留了 空格

和换行

"计算机输出"标签:(不同的“计算机输出”标签的显示效果,这些标签常用于显示计算机/编程代码。)

定义计算机代码。 例:Computer code

定义键盘码。 例:Keyboard input

定义计算机代码样本。例:Sample text

定义打字机代码。 例:Teletype text

定义变量。 例:Computer variable

不建议使用的有:

地址标签:(地址标签)

例:

破碎人生

CHINA

文本缩写标签:(缩写的文本)

例:etc

首字母缩写标签:(首字母缩写的文本)

例:WWW

文字方向::两种值:ltr(文字从右到左)、rtl(文字从左到右)

例:abc 结果为:cba

abc 结果为:abc

定义水平线:

今天的笔记就到这里,有不懂的可以提问,大神勿喷~

本文来自企鹅号 - 极客AND编程媒体

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Micro_awake web

重温CSS3

基础不牢,地动山摇!没办法,只能重温“经典”! 1.CSS3边框:border-radius;  box-shadow;  border-image borde...

37880
来自专栏向治洪

html5 jqueryrotate插件实现旋转动画

CSS3 提供了多种变形效果,比如矩阵变形、位移、缩放、旋转和倾斜等等,让页面更加生动活泼有趣,不再一动不动。然后 IE10 以下版本的浏览器不支持 CSS3...

43160
来自专栏AndroidTv

前端入门5-CSS弹性布局flex声明正文-弹性布局flex

作为一个前端小白,入门跟着这四个来源学习,感谢作者的分享,在其基础上,通过自己的理解,梳理出的知识点,或许有遗漏,或许有些理解是错误的,如有发现,欢迎指点下。

13420
来自专栏Android干货

浅谈GridLayout(网格布局)

42690
来自专栏TechBox

一篇文章详解iOS之AutoResizing、AutoLayout、sizeClass来龙去脉前言三大适配技术

33960
来自专栏Sign

web版《合成10》制作过程

《合成10》是一个很容易上瘾的游戏。 之前尝试的写了个网页版,游戏地址 ccx01.com/game/get10/ 现在写一下网页版合成10的制作过程。 这个游...

355120
来自专栏非著名程序员

基础篇章:React Native之Flexbox的讲解(Height and Width)

(友情提示:RN学习,从最基础的开始,大家不要嫌弃太基础,会的同学请自行略过,希望不要耽误已经会的同学的宝贵时间) 今天在讲解Flexbox之前,我们先讲解一下...

23070
来自专栏LIN_ZONE

css 中 zoom和transform:scale的区别(转载)

还在几年前,zoom还只是IE浏览器自己私有的玩具,但是,现在,除了FireFox浏览器,其他,尤其Chrome和移动端浏览器已经很好支持zoom属性了:

12230
来自专栏web前端

HTML+CSS基础

第一章 一、样式      1、行间样式,代码不可维护,不推荐      2、内联样式,不可重用,不推荐      3、外联样式,可重用,可维护,推荐     ...

88790
来自专栏偏前端工程师的驿站

CSS魔法堂:重拾Border之——图片作边框

前言  当CSS3推出border-radius属性时我们是那么欣喜若狂啊,一想到终于不用再添加额外元素来模拟圆角了,但发现border-radius还分水平半...

27260

扫码关注云+社区

领取腾讯云代金券