前端基础知识总结

女爷i 2021-09-25 03:50 468阅读 0赞

1.将文字显示在图片上:  
(1) 第一种方式:将图片作为背景(使用条件,图片的大小跟div的大小一样,照片才能显示完整,不然只会显示一部分)

<div style="width:1490px;height:600px;background-image:url(images/xxxx.png)">

(2) 第二种方式通过绝对定位将文字放到图片上,好处:图片可以通过控制width和height进行控制大小,而且是全部显示,文字需要使用span标签

<div style="position: relative;width:180px; float:left;align:right;font-size:23px;">
    	<img src="images/gaitubao_half_blue_180.png" width="130px" height="90px"></img>
    	<span style="position: absolute; top:20px; left:20px;">
    			XXXXX
    	</span>
    </div>

2.对制作好的页面进行放大或者缩小  
属性: zoom

body{ 
    	zoom:0.75;	
    }

3.对a标签进行修改  
(1)去除a标签下的横线

<a href="#" style="text-decoration:none">更多</a>

(2)修改a标签默认的蓝色

<a href="#" style="color:red">更多>></a>

4.margin-left:auto实现右对齐

.father {
          width: 300px;
          background-color: #f0f3f9;
        }
        .son {
          width: 200px;
          height: 120px;
          margin-left: auto;
          background-color: #cd0000;
        }
    
    <div class="father">
        <div class="son"></div>
      </div>

5.在li里面存放a标签,文字需要放在a标签内,不能放在li层

<li class="m2"><a href="http://www.baidu.com/" target="_blank" class="a1">首页<a/></li>

6.a标签去除下划线 更改字体颜色 页面跳转到新的窗口

.a1{
    	color:white;
    	text-decoration:none
    }
    target="_blank"

发表评论取消回复

表情：

评论列表（有 0 条评论，468人围观）

还没有评论，来说两句吧...

相关阅读

相关前端知识点总结——JavaScript基础

前端知识点总结——JS基础 1.javascript概述(了解) 1.什么是javascript javascript简称为js，是一种运行于js解释器/

r囧r小猫/ 2022年10月02日 14:43/ 0 赞/ 277 阅读

相关前端基础知识总结---JS篇

JavaScript 面试知识点总结本部分主要是笔者在复习 JavaScript 相关知识和一些相关面试题时所做的笔记，如果出现错误，希望大家指出！目录

妖狐艹你老母/ 2022年09月10日 15:12/ 0 赞/ 503 阅读

相关前端基础知识总结---CSS篇

本部分主要是笔者在复习 CSS 相关知识和一些相关面试题时所做的笔记，如果出现错误，希望大家指出！目录 1.介绍一下标准的 CSS 的盒子模型？低版本 IE 的

女爷i/ 2022年09月10日 15:12/ 0 赞/ 282 阅读

相关前端基础知识总结---HTML篇

HTML 面试知识点总结本部分主要是笔者在复习 HTML 相关知识和一些相关面试题时所做的笔记，如果出现错误，希望大家指出！目录 1. DOCTYPE

﹏ヽ暗。殇╰゛Y/ 2022年09月10日 15:11/ 0 赞/ 315 阅读

相关前端基础知识总结1——基础知识

<table> <tbody> <tr> <td><b>目录</b></td> </tr> </tbody> </table> 1.基础知识

╰+攻爆jí腚メ/ 2022年06月04日 06:41/ 0 赞/ 461 阅读

相关前端基础知识

[Understanding ECMAScript 6 中文版（可下载电子书）][Understanding ECMAScript 6] Nicholas C. Zaka

╰+攻爆jí腚メ/ 2022年06月03日 00:00/ 0 赞/ 304 阅读

相关 Web前端基础知识总结

一、HTML和CSS 1. 你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么? IE: trident内核 Firefox：gecko内核 Saf

我不是女神ヾ/ 2022年03月01日 21:22/ 0 赞/ 684 阅读

相关前端知识总结

一.关于设置div宽度和高度的问题： 1、如果要以百分比设置元素（div）的尺寸，必要以父元素的尺寸作为参考，如果父元素没有设置尺寸，那么子元素（div）尺寸自然不会生效。

朴灿烈づ我的快乐病毒、/ 2021年12月05日 13:59/ 0 赞/ 313 阅读

相关前端基础知识

帧元素（有窗口元素:select元素，object元素，插件 IFrame）> HTML元素优先（帧元素：）表单（文本区域，列表框，各种输入框） > 非表单元素浏览

深碍√TFBOYSˉ_/ 2021年10月09日 04:18/ 0 赞/ 475 阅读

相关前端基础知识总结

1.将文字显示在图片上: (1) 第一种方式:将图片作为背景(使用条件,图片的大小跟div的大小一样,照片才能显示完整,不然只会显示一部分) <div style

女爷i/ 2021年09月25日 03:50/ 0 赞/ 469 阅读