css学习代码-文本、链接、边框

最新推荐文章于 2022-08-26 11:53:29 发布
最新推荐文章于 2022-08-26 11:53:29 发布
阅读量775 收藏
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011439289/article/details/9864209
版权

文本居中：

<html>
    <head>
        <title>css文本</title>
        <style type="text/css">
            table{
                text-align:center ;
            }
        </style>
    </head>
    
    <body>
        <table border="1" width="80%">
            <tr>
                <td>学号</td>
                <td>姓名</td>
            </tr>
            <tr>
                <td>007</td>
                <td>张三</td>
            </tr>
            <tr>
                <td>008</td>
                <td>李四</td>
            </tr>
        </table>
    </body>
</html>

下划线：

<html>
    <head>
        <title>css文本</title>
        <style type="text/css">
            p{
                text-decoration:underline ;
            }
        </style>
    </head>
    
    <body>
        <p>    
            下划线
        </p>
    </body>
</html>

伪类 链接：

<html>
    <head>
        <title>css文本</title>
        <style type="text/css">
            /*
                link:将从未访问过的链接设置红色
                visited:将已经访问过的链接设置绿色
                active:将当前得到焦点的链接设置为黄色
                hover:当鼠标悬停在链接上设置为橘黄色，斜体，字大小30px，间距20px
            */
            a:link{
                color:red ;
            }
            a:visited{
                color:green ;
            }
            a:active{
                color:yellow ;
            }
            a:hover{
                color:orange ;
                font-style:italic ;
                font-size:30px ;
                letter-spacing:20px ;
            }
        </style>
    </head>
    
    <body>
        <a href="#">link</a><p>
        <a href="#">visited</a><p>
        <a href="#">active</a><p>
        <a href="#">hover</a><p>
    </body>
</html>

去除下划线

<html>
    <head>
        <title>css文本</title>
        <style type="text/css">
            /*
                link:将从未访问过的链接设置红色
                visited:将已经访问过的链接设置绿色
                active:将当前得到焦点的链接设置为黄色
                hover:当鼠标悬停在链接上设置为橘黄色，斜体，字大小30px，间距20px
                去除下划线
            */
            a{
                text-decoration:none ;
            }
            a:link{
                color:red ;
            }
            a:visited{
                color:green ;
            }
            a:active{
                color:yellow ;
            }
            a:hover{
                color:orange ;
                font-style:italic ;
                font-size:30px ;
                letter-spacing:20px ;
            }
        </style>
    </head>
    
    <body>
        <a href="#">link</a><p>
        <a href="#">visited</a><p>
        <a href="#">active</a><p>
        <a href="#">hover</a><p>
    </body>
</html>

边框：

<html>
    <head>
        <title>css文本</title>
        <style type="text/css">
            table{
                border:1px solid black ;
                border-collapse:collapse ;
            }
            td{
                border:1px solid black ;
                border-collapse:collapse ;
            }
        </style>
    </head>
    
    <body>
        <table border="1" width="80%">
            <tr>
                <td>学号</td>
                <td>姓名</td>
            </tr>
            <tr>
                <td>007</td>
                <td>张三</td>
            </tr>
            <tr>
                <td>008</td>
                <td>李四</td>
            </tr>
        </table>
    </body>
</html>


小新8
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
编写css代码的方式
yun1996的博客
07-01 2079
html 在一个网页中负责的事情是一个页面的结构 css(层叠样式表) 在一个网页中主要负责了页面的数据样 第一种： 在style标签中编写css代码。 只能用于本页面中，复用性不强。 格式 ： <style type="text\css"> 编写css的代码。 </style> 例子： <!DOCT...
CSS样式表
SignalFire的博客
01-21 2404
一 CSS文字属性： color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/
CSS快速入门基础篇（一）
最新发布
只想和你一起进步
08-26 433
快速入门CSS基础知识！
CSS 文本和超链接
m0_58822373的博客
06-10 1003
一、CSS 文本属性 属性 含义 举例 color 设置文本颜色 color:red; text-align 设置文本水平对齐方式 text-align:center; line-height 设置文本的行高 line-height:25px; ...
前端技术—CSS常用代码大全
qq 2903359018博客
06-08 6682
各位读者好，今天广州蓝景小编带你探讨前端技术（HTML+CSS）入门之CSS常见代码大全，希望通过阅读本篇文章后大家有所收获，对前端知识有更深入的了解。HTML+CSS 可以很方便的进行网页的排版布局，还能减少很多不必要的代码。...
css入门学习
山有木兮
06-25 3681
学过前端的人，对HTML语言一定不会感到陌生，因为它是前端设计最基本的工具。然而，随着网站越来越复杂，网站的维护变得越来越重要，对设计师的要求也越来越高。
css常用代码大全(html+css代码).pdf
07-13
HTML和CSS是构建网页设计的基础，CSS（层叠样式表）尤其重要，因为它允许开发者对网页的布局、颜色、字体、大小等进行精确控制。...熟悉并熟练运用这些CSS代码，将能极大地提升网页设计的质量和效率。
纯CSS 链接悬停提示效果代码
09-05
这个纯CSS的链接悬停提示效果代码提供了一种优雅且实用的方法，它利用CSS的绝对定位和伪类选择器来创建动态的提示信息，为用户提供关于链接的额外信息，而无需离开当前页面或打开新窗口。 首先，我们来看一下这段...
鼠标经过图片显示边框的CSS代码
09-25
总结一下，实现“鼠标经过图片显示边框”的CSS代码主要分为两步： 1. 设置图片的初始样式，包括边框颜色、边距和高度。 2. 使用伪类 `:hover` 来定义鼠标悬停时的样式，通常是改变边框的颜色。 通过这样的方法，...
html-css-intermedio-clase4
03-19
5. **CSS预处理器**：预处理器如Sass和Less可以帮助编写更有效、可维护的CSS代码。它们引入变量、嵌套规则、混合(mixins)等功能，让CSS更像一个编程语言。 6. **CSS权重**：理解选择器的优先级（特异性）和继承的...
Html_Css_1-Progate:ProgateHTML和CSS课程-学习I代码
05-04
在"Html_Css_1-Progate: Progate HTML和CSS课程-学习I代码"这个资源中，我们可以深入理解这两门语言的基础知识以及如何将它们结合使用来创建交互式和美观的网页。 HTML是网页内容的结构语言，它定义了网页上的各个...
一篇搞定css基础（超详细，附代码）
qq_31539817的博客
09-18 1235
第一章：css概述 1.1.css的简介 1)什么是CSS css中文名称叫层叠样式表，层叠为css的布局，表示布局方式是通过一层层来实现的；样式是布局层的显示效果，主要是通过css提供的一些属性和属性值实现。 2)css的作用 使得页面显示效果更加好，CSS将网页内容和显示样式进行分离，提高了显示功能。也就是css负责网页的显示效果，html负责页面的结构，两者互不干扰。 1.2.html页面引入css样式的方式 html页面引入css样......
如何学习 CSS
前端大全
05-18 657
（给前端大全加星标，提升前端技能）英文：rachel-andrew 译文：廖泽恩https://zhuanlan.zhihu.com/p/57994014很多人想让我给...
HTML+CSS前端学习
X-Dragon的博客
05-23 1万+
HTML相关示例及代码：D:\XML HTML+CSS+JS\day01 HTML和day02 HTML CSS1、什么是HTML是用来描述网页的一种语言 ! (超文本标记语言)  HTML使用的是标签来描述网页1.1 HTMLCSS JavaScript的关系HTML 名词 CSS  形容词 JS   动词1.2 HTML标签是什么与XML中标签基本一致 ,  由w3c组织定义的一系列的标签名称...
css控制文本符及链接
weixin_45754070的博客
10-17 149
设置字体样式：font-style:normal正常（默认）,italic斜体 修饰文字：text-decoration:none正常，underline下划线，overline上划线，line-through删除线，blink闪烁（IE6/IE7不支持） 字符间距：letter-spacing：2em（正常的两倍） 单词间距:word-spacing:2em(两单词的间距) 设置文本缩进：tex...
CSS
weixin_43461864的博客
11-11 291
文章目录1、什么是CSS1.1、什么是CSS1.2、发展史1.3、快速入门1.4、CSS的3种导入方式2、选择器2.1、基本选择器-重要2.2、层次选择器2.3、结构伪类选择器2.4、属性选择器-（常用而且重要）3、美化网页3.1为什么要美化网页3.2字体样式3.3、文本样式3.4、阴影3.5、超链接伪类3.6、列表3.7、背景3.8、渐变4、盒子模型4.1、什么是盒子模型4.2、边框4.3、内外边距4.4、圆角边框4.5、盒子阴影5、浮动5.1、标准文档流5.2、display5.3、float5.4、父
CSS边框属性
三月nebula
10-30 1566
一、边框的属性  (一)、边框   1、简写方式     通过一个属性来控制四个方向的边框效果     属性： border：width style color; width：宽度; 可以改变边框的粗细，以px为单位。 style：样式; 可以定义边框样式。 取值：solid：实线 dotted：虚线 dashed：虚线 color：颜色; 可以...
css如何在html中链接代码,怎么在html中链接css文件？怎么链接css文件教程源码！...
weixin_33680199的博客
06-07 2189
在我们的平常学习中，每一个课时和每一个知识点直接都是有关联的，那么今天我们就来说说怎么在html中链接css文件，下面是小编为大家准备的一些链接css文件教程源码！1.行内式这是一种直接在html文件中书写的代码，通常我们使用style属性在特定的Html中标记设置css的样式，但是建议不要使用这种方式，因为在每一个html的标记中都需要单独的设置样式，如果当你使用这个方法的时候会加大工作量，而且...
html去掉图片超链接的边框：border:none
热门推荐
kungfu_panda的专栏
08-19 1万+
第一章（1） 计算机基础知识 点击下载
CSS3新特性：Firefox中的-moz-前缀多彩边框
例如，`a{color:red}`这条规则将所有链接（a标签）的文本颜色设置为红色。 在HTML文档中应用CSS有三种方式：行内样式表（在HTML元素内直接使用`style`属性），内部样式表（在`<head>`标签内的`<style>`标签中定义）...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值