HTML5+CSS3样式和样式之间怎么分开啊?

html-css010

HTML5+CSS3样式和样式之间怎么分开啊?,第1张

你好,HTML5主要是放网页代码和结构的,CSS主要是用来给网页内容(文字、图片)排版、添加样式以及制作简单动画的,简单来说就是美化页面,或者说就是让用户觉得更好看,于是运用HTML5+CSS 组合起来的技术,就能达到这种效果。下面我给你举例说明吧:

未添加样式: <p>我爱中国</p>

然后假如我把“我爱中国”变成红色、字体大小为22px

有3种方法(第二、第三种方法都要使用标签选择器):

行内样式(直接在标签元素内部添加,属性之间用英文输入法下的分号隔开):

<div>

<p style="color:redfont-size:22px">我爱中国</p>

</div>

内部样式(在<head>标签内部添加<style>标签):

<head>

<style>

div p{

color:red

font-size:22px

}

</style>

</head>

外部样式(先新建一个 .css文件,然后在<head>标签内部用<link/>引入):

先在.css文件写代码如下:

div p{

color:red

font-size:22px

}

再将.css文件引入,假如你的文件你命名为index.css,那么代码如下:

<head>

<link href="index.css"  ref="stylesheep"  type="text/css"/>

</head>

这样,三种方法达到的是同一种效果,只是第三种比较专业,实现了HTML代码和.css文件的完全分离,这样有几个好处:1.可以更容易被搜索引擎收录(这里涉及到SEO优化的知识);2.网页代码量减少了,网页打开速度加快了,能提高用户体验;3.便于网页后期的修改和维护。

今天先给你讲这么多,希望采纳,谢谢

你可以给放轮播图的那个div设一个类(class)名,然后打开这个轮播图附带的css,把所有选择器的前面都加上这个类名,那么它就只能在这个类中起作用了,不会影响到其他标签。比如给div加的类名是这个:

<div class="lbt">……

而假定轮播图的css是这样的:

ul {......}

ul li {......}

那么就可以改为:

.lbt ul {......}

.lbt ul li {......}

总之就是给每一行的前面加个小数点,再加类名,再加个空格,就行了。如果遇到逗号分隔的,则逗号两边都要加,比如:

li, a {......}

要改为

.lbt li, .lbt a {......}