首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端学习自学笔记:day05

今天是第五天的笔记,主要是HTML和CSS的,希望大家支持~

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

第五天的笔记:HTML AND CSS:

!important:保留css样式,防止被更高级的CSS覆盖掉。

例:.c{

color:pink !important;

}

十六位编码来表现颜色:例:#000000:红绿蓝 #00(红)00(绿)00(蓝),

可以缩减为三位数,即#000,每一个代表两个。

0:代表着颜色的缺失。

F:代表着最大的亮度。

三原色:rgb格式:rgb(0,0,0),0~255数值。rgb名字不更换。

例:body{

background-color:rgb(0,0,0);

}

Bootstrap(响应式设计):通过响应式设计来适应移动端的调整,Bootstap将会根据你的屏幕大小来调整HTML元素的大

小。

具体操作:通过添加下列代码到HTML开头来将Bootstrap添加到任意应用中:

重要:

href="//cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css"/>

img-responsive class属性:图片的宽度就能完美地适配页面的宽度。

例:

链接到同一文本的位置:首先被链接的位置的要设置name属性名,然后a标签的href="#属性名":例:

a

dad

跳出框架:target="_top"

例:点击这里

subject=Hello again:邮件发送名为Hello again的邮件。

-复习:图像链接:

是空标签,只包含属性,没有闭合标签。

图像地址:src="1.gif"

img的文本替代属性,当图像不能正确加载时显示的文本:alt:例:alt="文本"

添加背景图片;background.注意:gif 和 jpg 文件均可用作 HTML 背景。

例:

图片对齐方式;align="",有bottom(底部)、middle(中间)、top(顶部)、life(浮动到文本的左侧)、right(浮动到文本的右侧):

bottom 对齐方式是默认的对齐方式

例:

-复习:控制图片的大小:width(宽度)、height(高度):例:

HTML表格:使用

使用标签来定义行:

使用标签来定义单元格,同时添加数据:数据

使用border属性来定义边框:border="1"

使用标签来定义表头:文本

例:

Heading

Another Heading

row 1,cell 1

空格占位符:

垂直的表头:把每个表头分别用标签包裹:

例:

姓名

性别

标签:设计表格的标题:

例:表格的标题

下一节:HTML表格:更多实例:跨行或跨列的表格单元格

谢谢大家观看~

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20171225A02WTN00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券