2020-05-21 23:01发布
为什么要初始化css样式
1.浏览器差异
不同浏览器对有些标签的默认值是不同的,如果没对css初始化会出现浏览器之间的页面显示差异
2.提高编码质量
如果不初始化,整个页面做完会很糟糕,重复的css样式很多
最简单的初始化方法是:(不建议)
1 * {padding: 0; margin: 0;}
淘宝样式 样式初始化
1 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } 2 body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; } 3 h1, h2, h3, h4, h5, h6{ font-size:100%; } 4 address, cite, dfn, em, var { font-style:normal; } 5 code, kbd, pre, samp { font-family:couriernew, courier, monospace; } 6 small{ font-size:12px; } 7 ul, ol { list-style:none; } 8 a { text-decoration:none; } 9 a:hover { text-decoration:underline; }10 sup { vertical-align:text-top; }11 sub{ vertical-align:text-bottom; }12 legend { color:#000; }13 fieldset, img { border:0; }14 button, input, select, textarea { font-size:100%; }15 table { border-collapse:collapse; border-spacing:0; }
腾讯QQ官网 样式初始化
1 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0} 2 body{font:12px"宋体","Arial Narrow",HELVETICA;background:#fff;-webkit-text-size-adjust:100%;} 3 a{color:#2d374b;text-decoration:none} 4 a:hover{color:#cd0200;text-decoration:underline} 5 em{font-style:normal} 6 li{list-style:none} 7 img{border:0;vertical-align:middle} 8 table{border-collapse:collapse;border-spacing:0} 9 p{word-wrap:break-word}
新浪官网 样式初始化
1 body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;} 2 body{background:#fff;color:#333;font-size:12px; margin-top:5px;font-family:"SimSun","宋体","Arial Narrow";} 3 4 ul,ol{list-style-type:none;} 5 select,input,img,select{vertical-align:middle;} 6 7 a{text-decoration:none;} 8 a:link{color:#009;} 9 a:visited{color:#800080;} 10 a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
网易官网 样式初始化
1 html {overflow-y:scroll;} 2 body {margin:0; padding:29px00; font:12px"\5B8B\4F53",sans-serif;background:#ffffff;} 3 div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margin:0;} 4 table,td,tr,th{font-size:12px;} 5 li{list-style-type:none;} 6 img{vertical-align:top;border:0;} 7 ol,ul {list-style:none;} 8 h1,h2,h3,h4,h5,h6{font-size:12px; font-weight:normal;} 9 address,cite,code,em,th {font-weight:normal; font-style:normal;}
每个浏览器打开都有不同的默认样式,初始化样式 是让页面兼容多个浏览器 提高用户体验
当然,初始化样式会对SEO(SEO是由英文Search Engine Optimization缩写而来, 中文意译为“搜索引擎优化”。SEO是指通过对网站内部调整优化及站外优化,使网站满足搜索引擎收录排名需求,在搜索引擎中提高关键词排名,从而把精准用户带到网站,获得免费流量,产生直接销售或品牌推广。)但是相比较起来,初始化相对重要,则我们应该在力求影响最小的情况下完成css初始化
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。简单地说,能够从 App 屏幕和浏览器上看到的东西都属于前端。前端技术一般分为前端设计和前端开发,前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基...
inputname=type=textstyle=width:200px;height:20px;
一般在4.5个月左右。
女生零基础学web前端是不难的。这是比较注重实际动手操作的学科,只要你肯用心学,并且有专业老师的指导,女生零基础学web前端,只需要4个月左右的时间
很适合女生学习,主要是看自己在这方面有没有兴趣
CSS主要的作用就是给网页中的dom元素设置样式,选择器则是用来匹配dom元素的。CSS中的选择器有三种,分别是标签选择器(根据元素标签名称),类选择器(根据元素class属性),id选择器(根据元素id属性),并且三种选择器可以相互结合使用例如:body{background-col...
html、css、js、框架、小程序等
根据自己的兴趣和实际情况来选择编程:Java、大前端、Python人工智能、大数据、Linux云计算、软件测试、PHP、网络安全设计:UI设计、产品经理、三维可视化设计、影视动画、室内设计、VR/AR运营:互联网营销、新媒体运营、短视频运营、电商运营每个人都是不同...
HTML123倒计时JS//验证码var counts = 60;function settime(val) { if(counts == 0) { val.removeAttribute(disabled); val.value = 获取验证码; counts = 60; return...
HTML中有个class为box的div元素,通过修改css样式让box元素在页面水平垂直居中显示
HTML,CSSJavaScriptjQueryvue,React微信小程序,公众号
对于前端初学者来说,html+css是入门前端最基础的内容,要学好并熟练运用html+css可从以下几点出发: 1.结合html+css+Photoshop,学会如何切割页面。所谓切图是指将设计稿切成便于制作成页面的图片,并完成html+css布局的静态页面。 2.打开有关浏览器网页,参...
html如何让文字居中显示通过设置左右margin值为auto来实现居中的。我们来看个例子就是专设置属div这个块状元素水平居中:html代码:div{border:1pxsolidred;/*为了显示居中效果明显为div设置了边框*/width:200px;margin:20pxauto;/*margin-left与margin-right...
有关块与内联元素的心得(内联元素右对齐)未改代码:目的:将日期右对齐,但下面的代码,把含日期内联元素转为块元素,再让其向右浮动,但结果显得为错位显示.未能达到预期目的. New Document #css01{width:360px;height:300px;text-align : left; float:left;margin...
最多设置5个标签!
因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异。
为什么要初始化css样式
1.浏览器差异
不同浏览器对有些标签的默认值是不同的,如果没对css初始化会出现浏览器之间的页面显示差异
2.提高编码质量
如果不初始化,整个页面做完会很糟糕,重复的css样式很多
最简单的初始化方法是:(不建议)
淘宝样式 样式初始化
腾讯QQ官网 样式初始化
新浪官网 样式初始化
网易官网 样式初始化
每个浏览器打开都有不同的默认样式,初始化样式 是让页面兼容多个浏览器 提高用户体验
因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异。
相关问题推荐
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。简单地说,能够从 App 屏幕和浏览器上看到的东西都属于前端。前端技术一般分为前端设计和前端开发,前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基...
inputname=type=textstyle=width:200px;height:20px;
一般在4.5个月左右。
女生零基础学web前端是不难的。这是比较注重实际动手操作的学科,只要你肯用心学,并且有专业老师的指导,女生零基础学web前端,只需要4个月左右的时间
很适合女生学习,主要是看自己在这方面有没有兴趣
CSS主要的作用就是给网页中的dom元素设置样式,选择器则是用来匹配dom元素的。CSS中的选择器有三种,分别是标签选择器(根据元素标签名称),类选择器(根据元素class属性),id选择器(根据元素id属性),并且三种选择器可以相互结合使用例如:body{background-col...
html、css、js、框架、小程序等
根据自己的兴趣和实际情况来选择编程:Java、大前端、Python人工智能、大数据、Linux云计算、软件测试、PHP、网络安全设计:UI设计、产品经理、三维可视化设计、影视动画、室内设计、VR/AR运营:互联网营销、新媒体运营、短视频运营、电商运营每个人都是不同...
HTML123倒计时JS//验证码var counts = 60;function settime(val) { if(counts == 0) { val.removeAttribute(disabled); val.value = 获取验证码; counts = 60; return...
HTML中有个class为box的div元素,通过修改css样式让box元素在页面水平垂直居中显示
HTML,CSSJavaScriptjQueryvue,React微信小程序,公众号
对于前端初学者来说,html+css是入门前端最基础的内容,要学好并熟练运用html+css可从以下几点出发: 1.结合html+css+Photoshop,学会如何切割页面。所谓切图是指将设计稿切成便于制作成页面的图片,并完成html+css布局的静态页面。 2.打开有关浏览器网页,参...
html如何让文字居中显示通过设置左右margin值为auto来实现居中的。我们来看个例子就是专设置属div这个块状元素水平居中:html代码:div{border:1pxsolidred;/*为了显示居中效果明显为div设置了边框*/width:200px;margin:20pxauto;/*margin-left与margin-right...
有关块与内联元素的心得(内联元素右对齐)未改代码:目的:将日期右对齐,但下面的代码,把含日期内联元素转为块元素,再让其向右浮动,但结果显得为错位显示.未能达到预期目的. New Document #css01{width:360px;height:300px;text-align : left; float:left;margin...