HTML+CSS基础篇
FaceToBook
Talk is cheap. Show me the code!
展开
-
前端学习基础第二天
引入表格web前端页面的有很多模块可以使用表格来实现。比如:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-sca...原创 2019-07-02 10:23:03 · 307 阅读 · 0 评论 -
前端学习篇第十一天
制作ico图标第一步:获取或者是制作ico图标的图片。第二步:进入在线制作ico图片网站 网站在线制作ico图标。假设有一张图片。将其制作成图标。进入网站会出现以下界面,依次点击即可。于是就有了图标图标引入的代码:<link rel="shortcut icon" href="../ifavicon.ico" type="image/x-icon"> //其中这个...原创 2019-07-06 14:22:19 · 125 阅读 · 0 评论 -
前端学习基础第十天
css文件代码压缩一、安装node和npm(不做介绍,在我之前转载的博客中有)二、安装ckstyle npm install -g ckstyle三、安装ckstyle-serve(仅仅代码压缩可以不用安装这个) npm install -g ckstyle-serve使用介绍:压缩css文件命令:先把需要压缩的文件上传至linux系统中去 example: rz bas...原创 2019-07-04 14:11:51 · 173 阅读 · 0 评论 -
前端学习基础第九天
练习独立完成网站底部和中间块的书写。以京东首页为例。效果图如下:原创 2019-07-03 12:32:43 · 97 阅读 · 0 评论 -
前端学习基础第八天
引入图标字体字体图标的优点:体积更小,但携带的信息没有削减。支持所有的浏览器。可以随意改变颜色、产生阴影、透明效果等。移动端设备必备良药。最常用使用的两种图标字体: icomoon(德国)、icofont (国内)。引入图标字体步骤如下。第一步:先去官网下载自己需要的图标字体的压缩包,然后进行解压。将其添加至项目src目录下。第二步:引入图标字体(注意,这个本质是字体,因此占用的存...原创 2019-07-02 16:31:38 · 559 阅读 · 0 评论 -
前端学习基础第七天
重要样式display显示样式:display:none; /*隐藏样式 */ 这个不会占用页面的位置display:block; / *这个可以用来显示样式 */display:inline-block; /*行内块样式 */display:inline; /*行内元素 */visibility 显示样式:visibility: visible; /*这个用来显...原创 2019-07-02 10:23:51 · 121 阅读 · 0 评论 -
前端学习基础篇一
常用标签介绍标题标签:<h1>~<h6>盒子:<div> ,<span>点击标签: <a>段落标签:<p>列表标签:ul>li [无序] ol>li [有序] dl>dt>dd [自定义列表]单标签: <br />换行 <img />...原创 2019-07-02 10:21:56 · 234 阅读 · 0 评论 -
前端学习基础第四天
一、css三大特性及注意事项css三大特性层叠性样式的设置是以一层一层的形式来叠加生效的.继承性子标签的样式,可以从父级标签中样式继承下来,但只有一部分样式是可以继承的。且继承的权重为0,一旦子标签的样式进行了设置,则会放弃父级标签的样式,应用自己的样式。优先级在选择标签的时候,存在优先级的问题,优先级的权重排序如下:!important>style="行内样式 ">...原创 2019-07-02 10:23:27 · 735 阅读 · 0 评论 -
前端学习基础第六天
浮动清除的四种方式为什么需要清楚浮动?因为在有些时候我们设置一个block盒子过程中无法给出一个确切的高度的时候,而里面的子block采用了浮动,会导致高度有可能消失了,接下来没有浮动的标签直接填充在block盒子的最上面。失去了盒子包括子block的效果。额外标签法在盒子后面添加一个标签。样式中添加: clear: both; .clear{ clear:...原创 2019-07-02 10:23:44 · 1163 阅读 · 0 评论 -
前端学习基础第五天
零散注意知识点当一个div盒子出现margin-bottom和下一个div 盒子有margin-top同时存在的时候,会发生合并。只保留最大的那个margin。 .top1,.top2{ width: 300px; height: 200px; margin: 0px auto 20px; ...原创 2019-07-02 10:23:36 · 693 阅读 · 0 评论 -
前端学习基础第三天
一、常见各种选择器.标签选择器类选择器id选择器后代选择器子代选择器交集选择器并集选择器伪类选择器1,标签选择器,通过直接选择标签的方式,来对标签的内部样式进行调整 em{ font-style: normal; color: skyblue; }<p>新浪体育讯 7月16日是燕京啤酒<em...原创 2019-07-02 10:23:18 · 194 阅读 · 0 评论 -
前端学习html+css完结篇第十二天
css3中 3d变形transform先介绍这个之前引入一个新知识;由于这个参数是css3的样式,必然存在老版本浏览器不支持的情况。因此为了保证兼容之前的浏览器,于是就有了浏览器的前缀。浏览器的前缀 | 浏览器-webkit- | Google Chrome, Safari ,Android Browser-moz- | Firefox-o- | Opera-...原创 2019-07-09 16:54:24 · 154 阅读 · 4 评论