006.前端开发知识,前端基础CSS(2020-01-21)

来源:第五天  01盒子水平居中

一、盒子中文字控制:

  1.text-align: center; /*可以让盒子内容(文字 行内元素 行内块元素)居中对齐*/

二、让盒子水平居中对齐:

  方法1.margin: 0 auto; /*通俗写法 0 auto  上下是 0  左右是auto  水平居中对齐 */

  方法2. margin-left: auto;   margin-right: auto; /*自动充满*/

  方法3.margin: auto; /* 上下左右都是auto*/

来源:第五天  02外边距合并

一、css初始化

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin:0; padding:0; }
body { font-size:12px; color:#666; font-family:Verdana, Microsoft YaHei, Simsun; background:#fff; line-height:24px; }
fieldset, img { border:0; }
ol, ul { list-style:none; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
em { font-style:normal; }
input, button, select, textarea { outline:none; }
textarea { resize:none; }
p{ text-align:justify; text-justify:distribute;}

原文地址:https://www.cnblogs.com/hzjdpawn/p/12221846.html

时间: 2024-08-28 12:22:52

006.前端开发知识,前端基础CSS(2020-01-21)的相关文章

前端开发知识体系部

1. 前言 本文把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的是想要颠覆人们对于前端只有三大块(html.css.js)的认识--做web前端需要的比这三大块要多得多. 在看内容之前,先看一下这个知识框架的预览图.图太大不好展示,看不清除,可在此下载清晰版:http://pan.baidu.com/s/1hqIUvUc (内有整个知识体系的图片和xmind文件) 2. 分类 所有知识框架,那肯定是一个结构型的展现,就是一棵树.web前端的知识点非常多,

前端开发知识学习概要

前端开发工具 编辑器 editPlus sublime 浏览器: Chrome Safari Firebox IE 插件:firebug chrome: inspect element html 组成结构 1 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前,不是 HTML 标签: 2 它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令, 浏览器读取. 3 <html> 4 <head> 5 描述页面

Brackets - 强大免费的开源跨平台Web前端开发工具IDE (HTML/CSS/Javascript代码编辑器)

Brackets 是一个免费.开源且跨平台的 HTML/CSS/JavaScript 前端 WEB 集成开发环境 (IDE工具).该项目由 Adobe 创建和维护,根据MIT许可证发布,支持 Windows.Linux 以及 OS X 平台. Brackets 的特点是简约.优雅.快捷!它没有很多的视图或者面板,也没太多花哨的功能,它的核心目标是减少在开发过程中那些效率低下的重复性工作,例如浏览器刷新,修改元素的样式,搜索功能等等.和 Sublime Text.Everedit 等通用代码编辑器

web前端开发教程:div+css的6个优点

关于div+css你知道多少?XHTML网站设计标准中,不再使用表格定位技术,而是采用div+css的方式实现各种定位.一般来说,div+css是web设计标准,它是一种网页的布局方法,与传统中经过表格(table)布局定位的方法有所区别,它能够完成页面页面内容与体现相别离, 那么你在前端开发学习对div+css的优点了解多少呢?接下来Div css教程学习中,为大家介绍web前端开发中div+css的6个优点. 介绍web前端开发中div+css的6个优点 1.契合W3C规范标准.这确保您的网

Web前端开发实战6:CSS实现导航菜单结合二级下拉式菜单的简单变换

前面几篇博文都在讲导航菜单和二级下拉式菜单,其实有很多方法都可以实现的,具体的情况还要视情况而定. 在后面学习到jQuery框架之后,会有更丰富的动画效果,由于在学习Ajax和jQuery的初步阶段,对于很多的复杂的导 航菜单和二级下拉式菜单没法做,但是学习了CSS和JS还是能实现一些简单的变换的.这篇博文就来说说用CSS实现 导航菜单结合二级下拉式菜单的两个简单变换吧. 首先还是在前面博文的基础上加以实现,其实只用HTML和CSS还是可以做出不错的效果,但是相较于JS和 jQuery来说就有很

前端开发知识之前端移动端适配总结

meta标签到底做了什么事情 做过移动端适配的小伙伴一定有遇到过这行代码: <meta name="viewport" content="width=device-width, initial-scale=1.0"> 但是,很多小伙伴只是感性的认识:噢,我加了这行代码,然后页面的宽度就会跟我的设备宽度一致.然而,这种理解是很片面的.那么,这句话的本质到底是什么呢? 不急,我们先往下面看,这里先留个悬念. 几个专有名词和单位 这里,我们先来辨析一下在适配的

前端开发知识总结

目录: 一.HTML部分 二.CSS部分 三.JavaScript部分 四.jQuery部分 五.Bootstrap部分 一.HTML部分 XHTML和HTML有什么区别 XHTML是一种基本的web网页设计语言,XHTML是一个基于XML的置标语言 XHTML 元素必须被正确的嵌套 XHTML 元素必须被关闭 标签名必须用小写字母 XHTML 文档必须拥有根元素 2. 前端页面有哪几层构成,分别是什么?作用是什么? 1.结构层 HTML(页面结构内容)表示层 2. CSS(网页的样式和外观)

前端开发之-------------合理利用CSS的权重----------------

什么是CSS的权重?对于前端工程师来说,这是一个很基础的问题,如果前端工程师没有深刻理解这个概念,则很难写出高质量的CSS代码. 那么到底什么是CSS的权重呢?我们又怎么来进行判定CSS的权重呢? 讨论CSS的权重,则必须想了解而且是深刻的了解CSS样式的6种基础选择器:ID选择器.类选择器.属性选择器.伪类和为对象选择器.标签选择器以及统配选择器.所有在CSS样式中定义的选择符都是由这6种基础选择符组合而成的,组合的方式也分为三种:后代选择符.子选择符.相邻选择符.(如果希望更详细的认识选择器

WEB前端开发学习----5.理解 CSS 浮动float

首先需要明白两个概念:内联元素 , 块元素. 内联元素 :也叫做行内元素,可以容纳文字或其他内联元素.内联元素的高度宽度都是不可以设置的,其宽度就是自身文字或者图片的宽度,不会进行换行.常见的内联元素:<span></span>, <a></a>, <img></img>, <font></font>, <strong></strong>等 块元素:可以容纳文本,其他内联元素和块元素.可