添加了品牌形象SVG额外的透明空间

时间:2018-10-05 17:43:22

标签: css svg twitter-bootstrap-3 adobe-illustrator

我在将图形另存为SVG时遇到问题,当我将其上传到我的网站时,在图形的顶部和底部添加了一堆透明空间,这将其向下推入导航并使其隐藏。

我正在使用引导程序3。

以下是原始内容: enter image description here

这是我上传svg时发生的情况: enter image description here

奇怪的是,在检查第二个svg图像时,图像大小为0x0像素(自然116x150像素)

有人知道发生了什么事吗?

摘要;

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="287.11px" height="30.87px" viewBox="0 0 287.11 30.87" enable-background="new 0 0 287.11 30.87" xml:space="preserve">
<title>Newlogo</title>
<rect x="54.61" y="26.85" fill="#231F20" width="16.19" height="1.43"/>
<rect x="88.46" y="26.85" fill="#231F20" width="189.09" height="1.43"/>
<path fill="#231F20" d="M95.11,10.49h-2.09l0.46-1.32l9.07-0.33l-3.07,8.89c-0.73,2.1-1,3.47-0.87,4.08
	c0.22,0.91,1.34,1.38,3.35,1.38c3,0,5.35-0.83,7-2.55c1.106-1.33,1.93-2.871,2.42-4.53l1.46-4.2c0.23-0.69,0.13-1.09-0.29-1.21
	c-1.406-0.181-2.824-0.244-4.24-0.19l0.46-1.31l9.65-0.34l-4.39,12.7c-0.25,0.74-0.24,1.2,0,1.42c0.459,0.306,1.011,0.444,1.56,0.39
	h2.43l-0.45,1.25l-9.28,0.3l1-2.87c-1.308,0.955-2.737,1.732-4.25,2.31c-1.544,0.551-3.171,0.835-4.81,0.84
	c-1.909,0.129-3.811-0.332-5.45-1.32c-1.19-0.81-1.45-2.2-0.77-4.18l2.77-7.71l0.16-0.63c0.115-0.257,0-0.559-0.257-0.674
	c-0.024-0.011-0.048-0.019-0.073-0.026C96.12,10.536,95.615,10.479,95.11,10.49z"/>
<path fill="#231F20" d="M127.78,15.83c0.403-1.07,1.015-2.049,1.8-2.88c1.528-1.842,3.807-2.894,6.2-2.86c2.227,0,3.56,0.703,4,2.11
	c0.197,0.761,0.155,1.564-0.12,2.3c-0.22,0.62-0.47,1-0.78,1.12c-0.561,0.183-1.151,0.261-1.74,0.23L127.78,15.83z M123.23,23.11
	c2.213,1.525,4.866,2.277,7.55,2.14c2.363,0.039,4.71-0.386,6.91-1.25c1.948-0.807,3.726-1.974,5.24-3.44l-1.58-0.61
	c-1.052,0.912-2.191,1.719-3.4,2.41c-1.659,0.8-3.479,1.207-5.32,1.19c-3.17,0-5.07-0.88-5.69-2.63
	c-0.34-1.233-0.252-2.544,0.25-3.72h16.87c0.69-2.46,0.39-4.48-0.9-6.07s-3.58-2.39-6.86-2.4c-3.199-0.033-6.344,0.819-9.09,2.46
	c-2.753,1.64-4.52,3.58-5.3,5.82c-0.913,2.667-0.467,4.7,1.34,6.1H123.23z"/>
<path fill="#231F20" d="M148.42,13.36c0.591-1.468,1.727-2.65,3.17-3.3c1.862-0.924,3.923-1.374,6-1.31
	c1.311-0.032,2.62,0.137,3.88,0.5c0.676,0.204,1.319,0.503,1.91,0.89l2-1.27h1.67l-2,5.6h-1.86c-0.081-0.981-0.449-1.917-1.06-2.69
	c-1-1.13-2.67-1.68-5-1.69c-1.252-0.038-2.498,0.184-3.66,0.65c-0.828,0.28-1.502,0.892-1.86,1.69c-0.28,0.8,0.06,1.42,1,1.81
	c0.914,0.331,1.864,0.552,2.83,0.66l4.1,0.59c2.27,0.35,3.82,0.87,4.66,1.6c0.898,0.84,1.134,2.172,0.58,3.27
	c-0.672,1.689-2.038,3.008-3.75,3.62c-2.043,0.88-4.246,1.326-6.47,1.31c-1.272,0.038-2.542-0.131-3.76-0.5
	c-0.952-0.262-1.859-0.666-2.69-1.2l-2.33,1.54h-1.74l2.2-6.4h1.91c0.054,1.111,0.433,2.182,1.09,3.08c1.15,1.41,3.15,2.08,6,2.08
	c1.41,0.047,2.813-0.216,4.11-0.77c0.88-0.321,1.598-0.975,2-1.82c0.318-0.662,0.04-1.457-0.622-1.775
	c-0.086-0.041-0.175-0.073-0.268-0.095c-1.964-0.579-3.97-1.004-6-1.27c-1.882-0.181-3.711-0.721-5.39-1.59
	C148.14,15.93,147.9,14.87,148.42,13.36z"/>
<path fill="#231F20" d="M169.45,10.86l0.51-1.47h0.61c2.447-0.101,4.747-1.195,6.37-3.03c1.038-1.104,1.859-2.393,2.42-3.8h2.09
	l-2.36,6.8h7.69l-0.47,1.39h-7.7l-3.38,9.78c-0.223,0.51-0.279,1.077-0.16,1.62c0.23,0.76,1,1.19,2.38,1.19
	c1.525,0.009,2.981-0.635,4-1.77c0.712-0.832,1.289-1.77,1.71-2.78h2c-0.494,1.462-1.315,2.793-2.4,3.89
	c-1.827,1.787-4.407,2.68-7.74,2.68c-2.61,0-4.18-0.62-4.73-1.82c-0.292-0.875-0.246-1.828,0.13-2.67l3.46-10L169.45,10.86z"/>
<path fill="#231F20" d="M188.99,15.6l2.23-0.06c-0.213,2.115,0.519,4.216,2,5.74c1.513,1.64,4.22,2.463,8.12,2.47
	c2.341,0.117,4.68-0.283,6.85-1.17c1.502-0.596,2.687-1.792,3.27-3.3c0.397-0.884,0.237-1.918-0.41-2.64
	c-0.64-0.7-2.17-1.31-4.59-1.8l-4.57-0.82c-2.502-0.341-4.952-0.996-7.29-1.95c-1.856-0.787-2.723-2.929-1.936-4.785
	c0.018-0.042,0.036-0.084,0.056-0.125c0.66-1.9,2.26-3.53,4.82-4.9c2.735-1.391,5.773-2.078,8.84-2
	c2.001-0.036,3.996,0.244,5.91,0.83c1.004,0.347,1.938,0.868,2.76,1.54l2.73-2.16h1.86l-2.41,8.73H215
	c0.043-1.929-0.676-3.797-2-5.2c-1.4-1.54-3.72-2.31-7-2.32c-2.121-0.099-4.232,0.338-6.14,1.27c-1.227,0.53-2.221,1.485-2.8,2.69
	c-0.449,1.143,0.079,2.438,1.2,2.94c1.262,0.608,2.612,1.013,4,1.2l6.91,1.24c2.92,0.507,4.937,1.34,6.05,2.5
	c1.11,1.15,1.34,2.68,0.67,4.59c-0.72,2.08-2.44,3.79-5.16,5.18c-2.974,1.368-6.217,2.051-9.49,2
	c-2.132,0.073-4.262-0.194-6.31-0.79c-1.413-0.34-2.745-0.955-3.92-1.81l-3.07,2.35h-1.91L188.99,15.6z"/>
<path fill="#231F20" d="M226.68,13.04c1.486-1.834,3.74-2.873,6.1-2.81c2.51,0,3.88,1,4.14,2.84c0.07,1.433-0.18,2.865-0.73,4.19
	c-0.602,1.787-1.597,3.417-2.91,4.77c-1.439,1.408-3.411,2.136-5.42,2c-1.91,0-3.15-0.6-3.7-1.8s-0.46-2.86,0.28-5
	C224.935,15.713,225.693,14.294,226.68,13.04z M220.22,22.91c1.41,1.61,3.88,2.43,7.39,2.43c3.124,0.04,6.195-0.813,8.85-2.46
	c2.66-1.63,4.34-3.49,5.07-5.6c0.886-2.039,0.447-4.413-1.11-6c-1.56-1.62-4-2.43-7.23-2.43c-2.994,0.01-5.934,0.799-8.53,2.29
	c-2.499,1.241-4.433,3.386-5.41,6C218.413,19.087,218.792,21.344,220.22,22.91L220.22,22.91z"/>
<path fill="#231F20" d="M250.17,10.87h-4.46l0.51-1.47h4.46c0.653-2.115,1.793-4.047,3.33-5.64c2.367-2.307,5.7-3.46,10-3.46
	c1.553-0.104,3.106,0.206,4.5,0.9c0.913,0.391,1.354,1.432,1,2.36c-0.258,0.577-0.712,1.044-1.28,1.32
	c-0.686,0.362-1.454,0.541-2.23,0.52c-0.665,0.047-1.326-0.129-1.88-0.5c-0.387-0.266-0.536-0.765-0.36-1.2
	c0.134-0.368,0.383-0.684,0.71-0.9c0.246-0.159,0.462-0.358,0.64-0.59c0.08-0.22-0.07-0.38-0.43-0.46
	c-0.44-0.097-0.89-0.14-1.34-0.13c-1.076-0.022-2.141,0.222-3.1,0.71c-0.987,0.516-1.842,1.252-2.5,2.15
	c-1.026,1.518-1.821,3.179-2.36,4.93h5.65l-0.5,1.47h-5.75l-3.88,11.15c-0.22,0.71-0.25,1.14-0.07,1.31
	c0.586,0.192,1.205,0.267,1.82,0.22h2.68l-0.44,1.31h-13.78l0.45-1.3h2.33c0.584,0.069,1.175-0.036,1.7-0.3
	c0.371-0.452,0.643-0.977,0.8-1.54L250.17,10.87z"/>
<path fill="#231F20" d="M262.46,10.89l0.52-1.46h0.63c2.432-0.101,4.719-1.184,6.34-3c1.043-1.086,1.85-2.377,2.37-3.79h2.14
	l-2.4,6.79h7.72l-0.55,1.39h-7.63l-3.4,9.78c-0.209,0.513-0.261,1.077-0.15,1.62c0.22,0.76,1,1.18,2.35,1.18
	c1.523-0.001,2.975-0.643,4-1.77c0.706-0.836,1.282-1.773,1.71-2.78h2c-0.505,1.484-1.363,2.822-2.5,3.9
	c-1.86,1.74-4.33,2.6-7.71,2.6c-2.61,0-4.17-0.6-4.72-1.81c-0.306-0.87-0.255-1.826,0.14-2.66l3.44-10L262.46,10.89z"/>
<path fill="#231F20" d="M66.23,18.08c1.126-0.59,2.378-0.899,3.65-0.9c2.47,0,3.89,0.75,4.27,2.24
	c0.148,1.162-0.017,2.343-0.48,3.42c-0.924,0.266-1.866,0.46-2.82,0.58c-0.663,0.094-1.331,0.151-2,0.17
	c-1.424,0.095-2.848-0.174-4.14-0.78c-0.828-0.408-1.176-1.406-0.78-2.24C64.334,19.467,65.162,18.57,66.23,18.08z M61.45,12.21
	c0.742-2.253,1.918-4.338,3.46-6.14c3.045-3.098,7.26-4.762,11.6-4.58c4.667,0,7.273,1.54,7.82,4.62
	c0.267,2.077-0.005,4.188-0.79,6.13c-0.552,1.789-1.325,3.502-2.3,5.1c-0.988,1.316-2.153,2.49-3.46,3.49
	c-0.056-1.091-0.447-2.139-1.12-3c-1.167-1.38-3.167-2.07-6-2.07c-2.001-0.032-3.979,0.428-5.76,1.34c-2.93,1.54-3.44,3.86-3.22,4
	c-1.9-1.6-1.04-6.51-0.23-8.88V12.21z M57.08,21.52c2.7,2.353,6.45,3.533,11.25,3.54c0.64,0,1.39,0,2.26-0.11
	c0.907-0.073,1.809-0.204,2.7-0.39c-0.386,1.323-0.41,2.725-0.07,4.06c0.57,1.49,2.19,2.24,4.81,2.24c2.199,0.068,4.351-0.64,6.08-2
	c1.082-0.952,1.916-2.153,2.43-3.5h-2.17c-0.308,0.764-0.736,1.473-1.27,2.1c-0.481,0.541-1.177,0.841-1.9,0.82
	c-0.777,0.032-1.503-0.389-1.86-1.08c-0.575-1.261-0.914-2.617-1-4c2.334-1.053,4.555-2.34,6.63-3.84
	c2.443-1.776,4.299-4.241,5.33-7.08c1.215-3.009,0.374-6.458-2.09-8.57c-2.6-2.453-6.327-3.68-11.18-3.68
	c-5.255-0.097-10.426,1.327-14.89,4.1c-3.85,2.41-6.28,5.1-7.32,8.08c-1.3,3.76-0.543,6.863,2.27,9.31H57.08z"/>
<line fill="none" x1="48.37" y1="30.47" x2="48.37" y2="0"/>
<polyline fill="none" points="48.37,0 0,0 0,30.47 "/>
<path fill="#3C5DAA" d="M15.55,0.18C11.052,0.427,7.17,3.415,5.78,7.7l-0.4,1.42c2.476-0.95,5.108-1.425,7.76-1.4
	c4.28,0,7.003,1.043,8.17,3.13c0.652,1.43,0.783,3.043,0.37,4.56c2.413-1.52,4.665-3.283,6.72-5.26
	c2.112-2.366,3.994-4.928,5.62-7.65c0.5-0.81,1-1.59,1.36-2.33H15.55V0.18z"/>
<path fill="#3C5DAA" d="M7.15,19.55c1.027-0.026,2.052-0.11,3.07-0.25c1.515-0.197,3.015-0.495,4.49-0.89
	c1.39-2.21,2.12-3.92,2.18-5.14c0.073-2.24-1.74-3.363-5.44-3.37c-2.027,0.035-4.024,0.498-5.86,1.36c-0.32,0.15-0.62,0.3-0.92,0.46
	L2.6,19.01C4.082,19.412,5.615,19.594,7.15,19.55z"/>
<path fill="#3C5DAA" d="M44.78,1.36c-0.18,0.37-0.42,0.76-0.64,1.14c-2.824,4.326-6.583,7.962-11,10.64
	c-3.706,2.217-7.581,4.136-11.59,5.74c-0.513,2.987-0.587,5.023-0.22,6.11c0.27,1.038,1.252,1.728,2.32,1.63
	c1.186-0.009,2.326-0.458,3.2-1.26c1.069-0.927,2.016-1.986,2.82-3.15h3.25l-0.4,0.64l-0.59,0.76c-1.16,1.525-2.562,2.849-4.15,3.92
	h-0.07h2.56c4.351-0.32,8.093-3.204,9.51-7.33v-0.15l5.7-19.88l0,0C45.24,0.56,45.07,0.96,44.78,1.36z"/>
<path fill="#3C5DAA" d="M13.42,21.01c-1.397,0.278-2.81,0.475-4.23,0.59c-1.33,0.1-2.47,0.16-3.42,0.16
	c-1.299-0.004-2.598-0.075-3.89-0.21c-1,3.38-1.71,6-1.71,6h11.47c-0.037-0.138-0.064-0.278-0.08-0.42
	C11.42,25.88,12.04,23.83,13.42,21.01z"/>
<path fill="#FFFFFF" d="M31.93,23.61l0.59-0.76l0.4-0.64h-3.25c-0.804,1.164-1.751,2.223-2.82,3.15
	c-0.874,0.802-2.014,1.251-3.2,1.26c-1.068,0.098-2.05-0.592-2.32-1.63c-0.34-1.073-0.26-3.107,0.24-6.1
	c4.009-1.604,7.884-3.523,11.59-5.74c4.417-2.678,8.176-6.314,11-10.64c0.22-0.39,0.46-0.77,0.64-1.14s0.42-0.81,0.62-1.2h-10
	c-0.41,0.74-0.85,1.52-1.36,2.33c-1.626,2.722-3.508,5.284-5.62,7.65c-2.055,1.977-4.307,3.74-6.72,5.26
	c0.413-1.517,0.282-3.13-0.37-4.56c-1.16-2.08-3.883-3.123-8.17-3.13c-2.652-0.025-5.284,0.45-7.76,1.4
	c-0.2,0.68-0.45,1.58-0.74,2.6c0.29-0.16,0.6-0.32,0.92-0.46c1.839-0.863,3.839-1.327,5.87-1.36c3.693,0,5.507,1.123,5.44,3.37
	c-0.07,1.22-0.79,2.93-2.18,5.14c-1.475,0.395-2.975,0.693-4.49,0.89c-1.018,0.14-2.043,0.224-3.07,0.25
	c-1.535,0.044-3.068-0.138-4.55-0.54c-0.24,0.87-0.49,1.72-0.73,2.53c1.292,0.139,2.59,0.212,3.89,0.22c1,0,2.1-0.05,3.42-0.16
	c1.42-0.115,2.833-0.312,4.23-0.59c-1.38,2.82-2,4.87-1.86,6.13c0.016,0.142,0.043,0.282,0.08,0.42h16.08h0.07
	C29.384,26.478,30.779,25.144,31.93,23.61z"/>
<path d="M284.61,19.98c0.507,0,1.005,0.138,1.44,0.4c0.432,0.261,0.756,0.669,0.91,1.15c0.167,0.503,0.198,1.041,0.09,1.56
	c-0.126,0.566-0.379,1.096-0.74,1.55c-0.371,0.487-0.85,0.881-1.4,1.15c-0.499,0.264-1.055,0.405-1.62,0.41
	c-0.519,0.007-1.029-0.135-1.47-0.41c-0.431-0.265-0.756-0.672-0.92-1.15c-0.159-0.502-0.183-1.036-0.07-1.55
	c0.13-0.57,0.387-1.103,0.75-1.56c0.374-0.484,0.853-0.877,1.4-1.15C283.486,20.126,284.043,19.989,284.61,19.98z M284.48,20.49
	c-0.467,0.007-0.926,0.124-1.34,0.34c-0.464,0.24-0.867,0.582-1.18,1c-0.302,0.384-0.52,0.827-0.64,1.3
	c-0.089,0.429-0.062,0.875,0.08,1.29c0.124,0.411,0.39,0.766,0.75,1c0.367,0.234,0.795,0.355,1.23,0.35
	c0.494-0.016,0.976-0.157,1.4-0.41c0.465-0.238,0.869-0.58,1.18-1c0.296-0.382,0.511-0.821,0.63-1.29
	c0.086-0.434,0.051-0.884-0.1-1.3c-0.11-0.418-0.379-0.777-0.75-1C285.356,20.557,284.918,20.459,284.48,20.49L284.48,20.49z
	 M282.19,24.81l0.71-3.34h1.16c0.286-0.014,0.573,0.016,0.85,0.09c0.165,0.055,0.302,0.174,0.38,0.33c0.042,0.164,0.042,0.336,0,0.5
	c-0.057,0.252-0.202,0.476-0.41,0.63c-0.214,0.182-0.48,0.291-0.76,0.31c0.091,0.049,0.175,0.109,0.25,0.18
	c0.147,0.203,0.265,0.425,0.35,0.66l0.28,0.66h-0.65l-0.2-0.53c-0.078-0.282-0.214-0.544-0.4-0.77c-0.122-0.088-0.27-0.13-0.42-0.12
	h-0.32l-0.3,1.42L282.19,24.81z M283.19,22.93h0.59c0.235,0.018,0.471-0.031,0.68-0.14c0.135-0.081,0.229-0.216,0.26-0.37
	c0.032-0.084,0.032-0.176,0-0.26c-0.035-0.088-0.109-0.155-0.2-0.18c-0.172-0.05-0.351-0.07-0.53-0.06h-0.63L283.19,22.93z"/>
</svg>

然后将AI画板裁剪为徽标:

AI File Screenshot

1 个答案:

答案 0 :(得分:0)

在您的一张图片中,我看到一张图片的宽度为width =“ 116” height =“ 150”。您的SVG尺寸为:宽度:287.11,高度:30.87。您不必具有相同的大小,但需要保持比例(请参见代码中的第二张图片)

img{border:1px solid;}
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/222579/%20BrianArnesen.svg" width="116" height="150"/>

<hr>


<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/222579/%20BrianArnesen.svg" width="116" height="12.472"/>