这都2020年了，还没认识CSS？
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">针对</span>新人<span style="color: black;">来讲</span>想要<span style="color: black;">认识</span>css，就要从最基本的入手<span style="color: black;">认识</span>，讲真的学习css入门很简单，学习html 和css<span style="color: black;">短期</span>后你就<span style="color: black;">能够</span>制作一个网页，深入的去学习的话，就会很难。他<span style="color: black;">便是</span>从简——深——深——简的一个过程，<span style="color: black;">倘若</span>你真正熟悉<span style="color: black;">把握</span>之后，就<span style="color: black;">能够</span><span style="color: black;">容易</span>对付<span style="color: black;">平常</span>工作。</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-481c127163a914d46f225dd97641b8e1_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">不管是传统的Web<span style="color: black;">研发</span><span style="color: black;">或</span>是现代的Web 应用<span style="color: black;">研发</span>，<span style="color: black;">最少</span>到今天为止还是离不开CSS。这篇<span style="color: black;">文案</span>带你们认识一下css.</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">什么是CSS ？</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">CSS（Cascading Style Sheets）层叠样式表，又叫级联样式表，简<span style="color: black;">叫作</span><span style="color: black;">便是</span>样式表，</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1、 用于html文档中元素样式的定义，实现了将内容与变现分离，<span style="color: black;">加强</span>了代码的可重用性和可<span style="color: black;">守护</span>性</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">例如：</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-aa5eb2b3ff267759f38d76d3d2f8c856_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">效果<span style="color: black;">照片</span>：</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-350dd0871d5e6072c2103368d82e1f1a_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">html:页面结构</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">css:页面美容</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2、 文件后缀是.css</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">3、 样式<span style="color: black;">一般</span>存储在样式表中</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">4、 <span style="color: black;">外边</span>样式表<span style="color: black;">能够</span><span style="color: black;">极重</span><span style="color: black;">加强</span>工作效率</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">5、 <span style="color: black;">外边</span>样式<span style="color: black;">一般</span>存储在CSS文件中</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">6、 多个样式定义可层叠为一</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">CSS与HTML 之间的关系是什么？</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1、 HTML用于构建网页的结构</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2、 CSS用于构建HTML元素的样式</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">3、 HTML是页面的内容<span style="color: black;">构成</span>，CSS是页面的变现</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">结构层：HTML <span style="color: black;">暗示</span>层：CSS <span style="color: black;">行径</span>层：JavaScript</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">怎么样</span><span style="color: black;">运用</span>CSS样式表的方式？</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1、内联方式</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span>style属性，只是对当前标签有效，页面内容和样式高度耦合(直接把CSS代码用style属性添加到<span style="color: black;">起始</span>标签中)</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><p style=”color:red”>红色字体</p></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">2、内部样式表</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在head中<span style="color: black;">运用</span>style标签，当前页面有效，内容和样式<span style="color: black;">必定</span>程度分离，<span style="color: black;">然则</span>不彻底(直接把CSS代码添加到头部的style标签中)</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><head></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><style></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">P{color:red;}</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"></style></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"></head></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">3、 <span style="color: black;">外边</span>样式表</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">将样式写到一个单独CSS文件中，<span style="color: black;">必须</span>用到HTML文件，引用它<span style="color: black;">就可</span>。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><link rel=”stylesheet” href=””/> StyleSheet,的意思<span style="color: black;">便是</span>样式调用</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">4、 导入式</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> <head></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><style></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">@import url(my.css);</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"></style></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"></head></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">优先级：行内样式>内部样式><span style="color: black;">外边</span>样式>导入样式</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">css加载方</p>
感谢您的精彩评论，为我带来了新的思考角度。 谷歌外链发布 http://www.fok120.com/ 回顾历史，我们感慨万千；放眼未来，我们信心百倍。
页:
[1]